当只有用户选择特定复选框时,如何显示 jquery 复选框列表的选定项目以及标签

2023-12-22

 <form novalidate="novalidate" class="wpcf7-form" name="myForm"  id="myForm">
   <fieldset>
   <div class="form_field odd">
      <label for='desktop'>Desktops </label> 
      <div class="form-group">
         <select id="ms" multiple="multiple">
            <option value="1">Made to Order(assembled)</option>
            <option value="2">HP/Compaq</option>
            <option value="3">IBM</option>
            <option value="4">Lenovo </option>
            <option value="5">etc</option>
         </select>
      </div>
   </div>
   <div class="form_field even">
      <label for='server'>Servers </label> 
      <div class="form-group">
         <select id="ms1" multiple="multiple">
            <option value="1">Made to Order(assembled)</option>
            <option value="2">Compaq</option>
            <option value="3">IBM</option>
            <option value="4">etc</option>
         </select>
      </div>
   </div>
   <div class="form_field odd">
   <label for='laptop'>Laptops </label> 
   <div class="form-group">
      <select id="ms2" multiple="multiple">
         <option value="1">HP/Compaq</option>
         <option value="2">IBM</option>
         <option value="3">Lenovo</option>
         <option value="4">Sony</option>
         <option value="5">Dell </option>
         <option value="6">etc</option>
      </select>
   </div>
</form>

FIDDLE http://jsfiddle.net/958jm4uo/

$("select[name='qwe'] option").click(function () {
    $(this).each(function () {
        var label = $(this).parent().parent().parent().find('label').text();
        var text = $(this).text();
        alert('option text is ' + text);
        alert('label text is ' + label);
    });
})

UPDATE

正如@mplungjan建议的那样FIDDLE http://jsfiddle.net/958jm4uo/5/

$("select[name='qwe']").change(function () {
    $(this).each(function () {
        var text1 = $(this).find('option:selected').text();
        var label1 = $(this).find('option:selected').parent().parent().parent().find('label').text();
        alert('option text is ' + text1);
        alert('label text is ' + label1);
    });

UPDATE

No .parent() with .closest('div.classnameoftheparentdiv')

FIDDLE http://jsfiddle.net/958jm4uo/7/

$("select[name='qwe']").change(function () {
    $(this).each(function () {
        var text1 = $(this).find('option:selected').text();
        var label1 = $(this).find('option:selected').closest('div.form_field').find('label').text();//HERE parent div that contains the label has a class form_field
        alert('option text is ' + text1);
        alert('label text is ' + label1);
    });
})
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

当只有用户选择特定复选框时,如何显示 jquery 复选框列表的选定项目以及标签 的相关文章

  • JavaScript - 无需布尔值即可运行一次

    有没有办法只运行一段JavaScript代码ONCE 而不使用布尔标志变量来记住它是否已经运行过 具体来说not就像是 var alreadyRan false function runOnce if alreadyRan return a
  • Sonar 中的 javascript 代码覆盖率

    我是使用 Sonar 和插件进行 javascript 代码覆盖的新手 使用 Sonar 分析时 有哪些可能性可以找出 javascript 代码的质量 包括代码覆盖率 目前我正在使用 karma runner 它提供代码覆盖率报告 可以在
  • 在多个动态添加的表单上初始化 jQuery validate() 函数

    有人建议最好初始化一个 form validate 在页面加载而不是点击事件上运行 jquery form validate 插件仅允许在输入更改时提交 https stackoverflow com questions 10984196
  • Angularjs 完整日历不显示事件

    我正在用那个https github com angular ui ui calendar https github com angular ui ui calendar在 Angularjs 中使用 FullCalendar 它显示日历并
  • 游戏手柄 JavaScript 未能按预期更新

    我正在尝试让浏览器报告我的 XBOX 控制器的状态 然而 在第一次按下按钮后 它似乎变得 卡住 我究竟做错了什么
  • html canvas动画卡顿

    谁能解释为什么提供的画布动画断断续续 我创建了一个测试存根来演示该问题 我在桌面上的 FF Chrome IE 以及 Android 上的 FF 和 Chrome 中看到了卡顿现象 口吃是由于垃圾收集造成的吗 似乎 raf 在每次调用时都会
  • 为什么我们使用 SpreadsheetApp.flush()?

    我的理解是 flush https developers google com apps script reference spreadsheet spreadsheet app flush有助于在功能发生时执行这些功能 而无需将它们捆绑在
  • 如何循环遍历对象数组并生成键值对?

    我有一个像这样的对象数组 let someObj items id 12 value true id 34 value true id 56 value false 我想将其添加到现有对象中 其中 id 是该对象的键 如下所示 let ob
  • 避免在 ES6 的函数内定位 this 的对象作用域

    例如 我正在使用 D3 js 运行一个项目 导入特定模块并调用它们的函数 Setup TypeScript ES6 导入特定的 D3 组件 角6 我有一个对象 在本例中是一个角度指令 并在 SVG 画布上绘制一些圆圈 并希望它们在拖动事件上
  • 如何在 javascript 中基于类型字符串创建新对象?

    如何基于变量类型字符串 包含对象名称 在 javascript 中创建新对象 现在我有 随着更多工具的出现 列表会变得更长 function getTool name switch name case SelectTool return n
  • put方法中的Angularjs文件上传不起作用

    我有一个简单的待办事项应用程序 我试图在其中上传照片和单个待办事项 现在我已经创建了这个工厂函数来负责待办事项的创建 todosFactory insertTodo function todo return http post baseUr
  • 将 window.location 传递给 Flask url_for

    我正在使用 python 在我的页面上 当匿名用户转到登录页面时 我想将一个变量传递到后端 以便它指示用户来自哪里 发送 URL 因此 当用户单击此锚链接时 a href Sign in a 我想发送用户当前所在页面的当前 URL
  • 尝试使用 Firebug 查找 JavaScript 文件中的函数

    我试图找到这个函数调用 myFooBar 该函数在某些 HTML 中内联引用 但页面加载了大量 JavaScript 并且在每个文件中搜索该函数需要相当多的工作 如何使用 Firebug 找到此函数所在的 JavaScript 文件 打开脚
  • Aurelia - 仅 HTML 自定义元素的内联定义

    我的 Aurelia 视图模型中有一个递归对象 如下所示 Class BottomlessPit Name string MorePits BottomlessPit null 因此 我想在 Aurelia 视图中使用递归模板 它只会在一个
  • jQuery:单击外部元素以“关闭”使用toggleClass 出现的菜单

    我已经构建了一些导航 针对移动网络 它使用 jQuery 中的toggleClass 方法来隐藏和显示菜单 单击 MENU 图标 按钮可在菜单 div 上打开和关闭类 active 显示 隐藏 我一直在拼命寻找一种通过单击菜单外部 页面上的
  • Django 将 JSON 数据传递给静态 getJSON/Javascript

    我正在尝试从 models py 中获取数据并将其序列化为views py 中的 JSON 对象 模型 py class Platform models Model platformtype models CharField max len
  • 弹出窗口的动态高度取决于内容,可能吗?

    是否有可能获得一个宽度始终为 400px 的弹出窗口 但根据弹出窗口中的内容动态高度 我已经看到了这个 但不知道如何将其应用到弹出窗口 调整 iframe 的宽度高度以适应其中的内容 https stackoverflow com ques
  • 如何:带有 onclick 的 div 位于另一个带有 onclick 的 div 中

    只是一个简单的问题 我遇到了 div 与 onclick javascript 之间的问题 当我点击内部 div 时 它应该只触发它的 onclick javascript 但外部 div 的 javascript 也会被触发 用户如何点击
  • D3 将现有 SVG 字符串(或元素)追加(插入)到 DIV

    我到处寻找这个问题的答案 并找到了一些我认为可能有用的资源 但最终没有让我找到答案 这里有一些 外部SVG http bl ocks org mbostock 1014829 嵌入SVG https stackoverflow com qu
  • 用javascript调用外部网页(跨域)

    我正在尝试使用以下网络服务来验证提要这个问题 https stackoverflow com questions 11996430 check if a url is a valid feed 但浏览器不允许我向另一台服务器发送 ajax

随机推荐