为jquery中的所有已检查行设置“选择”选项?

时间:2014-11-09 02:37:57

标签: javascript jquery

仍然在这里学习jquery,所以请原谅任何无知。

我有一个包含许多行的表。每行都有一个<select>标记,我想&#34;切换&#34;我执行函数时的值。所以这里的表格如下所示:

<table align="center" class="table table-bordered table-hover table-condensed table-responsive">
  <thead>
    ...
  </thead>
  <tbody>
    <tr>
      <td class="text-center"><input id="item_ids_" name="item_ids[]" type="checkbox" value="11521"></td>
      <td class="text-center">Item value here</td>
      <td class="text-center">
        <select class="form-control" id="item_11521_color" name="item[11521][color]">
          <option selected="selected" value="None">None</option>
          <option value="Blue">Blue</option>
          <option value="Orange">Orange</option>
          <option value="Green">Green</option>
          <option value="Yellow">Yellow</option>
          <option value="Purple">Purple</option>
        </select>
      </td>
      <td class="text-center">
        <select class="form-control" id="item_11521_test" name="item[11521][test]">
          <option selected="selected" value="None">None</option>
          <option value="First">First</option>
          <option value="Second">Second</option>
        </select>
      </td>
    </tr>
  </tbody>
</table>

每次运行此函数时,如何迭代每一行并将值(和文本)<option value="Blue">更改为<option value="Orange">等?

1 个答案:

答案 0 :(得分:2)

这是你在找什么? (代码更新)

$("#change").on("click", function() {

    // loop throw all rows
    $("table tr").each(function() {

        // on a row, find the checkbox and change the values if it's checked
        if($(this).find("input[type='checkbox']").prop("checked")) {
            $(this).find(".color-select").val("Green");
            $(this).find(".position-select").val("First");
        } 

    });

});

添加了一个按钮来执行更改:

<button id="change">change all to Green and first</button>

为简单而选择的类:

<select class="form-control color-select" id="item_11521_color" name="item[11521 [color]">
<select class="form-control position-select" id="item_11521_test" name="item[11521][test]">

修改

对代码进行必要的更改。

更新的小提琴:http://jsfiddle.net/theagitator/44vqugf0/1/