javascript – 初学者正在努力使用JQuery .change标记

2023年7月29日 189次阅读

很了解
HTML,我正在尝试学习
JQuery.我在
JQuery site上找到了.change函数,它完全符合我的要求.

理想情况下,我希望test1和test2只相互影响,test3和test4只相互影响,依此类推.

现在test2和test4同时影响test1和test3

这是我的代码：

<select id="test1" name="sweets" multiple="multiple">
<option>Chocolate</option>
<option selected="selected">Candy</option>
<option>Taffy</option>
<option selected="selected">Caramel</option>
<option>Fudge</option>
<option>Cookie</option>
</select>

<div id="test2"></div>

 <script>
    $("select#test1").change(function () {
    var str = "";
    $("select option:selected").each(function () {
        str += $(this).text() + " ";
     });
      $("div#test2").text(str);
     })
   .change();
</script>


<select id="test3" name="sweets" multiple="multiple">
<option>Chocolate</option>
<option selected="selected">Candy</option>
<option>Taffy</option>
<option selected="selected">Caramel</option>
<option>Fudge</option>
<option>Cookie</option>
</select>

<div id="test4"></div>

<script>
    $("select#test3").change(function () {
    var str = "";
    $("select option:selected").each(function () {
        str += $(this).text() + " ";
     });
      $("div#test4").text(str);
     })
   .change();
</script>

我尝试将它与ID分开,但它还没有完全存在.
我怎样才能让它正常工作？

最佳答案 这一行：

 $("select option:selected").each(function () {

应该这样写：

$("#test1 option:selected").each(function() {

通过在该行中使用通用“select”,您将选择页面上的每个“select”元素,而不是使用其id,它将仅定位所需的select标记.

点赞