Question

这是我在控制台日志中打印集合变量时的输出。

(14) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}]
0: {px_id: 2713, attr_name: "A", other_id: 4}
1: {px_id: 2712, attr_name: "B", other_id: 4}
2: {px_id: 2698, attr_name: "C", other_id: 4}
3: {px_id: 2694, attr_name: "D", other_id: 4}
4: {px_id: 2695, attr_name: "E", other_id: 4}
5: {px_id: 2693, attr_name: "F", other_id: 4}
6: {px_id: 2697, attr_name: "G", other_id: 4}
7: {px_id: 2714, attr_name: "H", other_id: 4}
8: {px_id: 2711, attr_name: "I", other_id: 4}
9: {px_id: 2699, attr_name: "J", other_id: 4}
10: {px_id: 2696, attr_name: "K", other_id: 4}
11: {px_id: 2710, attr_name: "L", other_id: 4}
12: {px_id: 2709, attr_name: "M", other_id: 4}
13: {px_id: 2708, attr_name: "N", other_id: 4}
length: 14__proto__: Array(0)

在HTML中，这就是选择选项的填充方式：

var html = "";
$_.each(collection, function(index_, term_) {
            html += "<option value='" + term_.px_id + "'>" + term_.attr_name + "</option>";
 });
 $_(".attrList").html(html);

HTML如下：

<table class="enc-data-table" align="center">

      <tr>
          <th><b>Attributes</b></th>
             <td> <select id="attrList"  class="attrList"></select></td>
      </tr>
  </table>

在控制台日志中，我可以看到2713在以下javascript函数的帮助下显示。

  $(".attrList").on("change", function() {
                            var testVal = $(".attrList option:selected").val();
                            console.log(testVal);
                            //alert(testVal);
                        });

当我从下拉菜单中选择不同的attr_name时，console.log(testVal);和alert(testVal);始终会显示数字2713。当我选择B时，我希望控制台日志能够显示2712，但它再次显示2713。对于C，我原以为2698但我又得到了2713等。我上面做错了什么？

只是为了进行测试，我将此行var testVal = $(".attrList option:selected").val();更改为var testVal = $(".attrList option:selected").text();，我能够看到A，B或C等基于选择，但价值部分似乎有问题。

我在这里做了一个简单的测试，它运行良好：

＆＃13;

$(".attrList").on("change", function() {
  var testVal = $(".attrList option:selected").val();
  console.log(testVal);
  alert(testVal);
});

＆＃13;

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id="attribute_config_dialog" class="modal fade" role="dialog">

  <div class="modal-dialog">

    <div class="modal-content">

      <div class="modal-header">
        <button type="button" class="close close-icon" data-dismiss="modal">&times;</button>
        <h2 class="modal-title">Test</h2>
      </div>

      <div class="modal-body">

        <table class="enc-data-table" align="center">

          <tr class="spaceUnder">
            <th><b>Attributes</b></th>
            <td>
              <select id="attrList" class="attrList">
                <option selected value="DEFAULT">Default</option>
                <option value="SEL1">Selection 1</option>
                <option value="SEL2">Selection 2</option>
              </select>
            </td>
          </tr>



        </table>

      </div>


    </div>
  </div>
</div>

＆＃13;

变更jQuery总是打印相同的值

0 个答案: