0

我正在努力使用动态标识符动态地获取下拉选择的值。我已经以静态方式完成了。任何人都可以建议我如何使每个“按钮”和“选择”标签的“id”动态化，并且在单击每个 GO 按钮时，值应该从同一行的选择下拉列表中显示。提前致谢。

=================

$(".button").click(function() {               
              var dataItem = $(this).data('item'),
              contentID = $('#'+dataItem);
              $('#output').html(contentID.val())
          });


=============

<table cellspacing="10" cellpading="10" border="0">
        <tr>
            <td>Application Name</td>
            <td>
                <select id="country">
                    <option>Select Any Country</option>
                    <option value="India">India</option>
                    <option value="Australia">Australia</option>
                    <option value="England">England</option>
                    <option value="Singapore">Singapore</option>
                    <option value="Canada">Canada</option>
                </select>
            </td>
            <td><input type="button" data-item="country" class="button" value="Go" /></td>
        </tr>
         <tr>
            <td>Application Name</td>
            <td>
                <select id="country1">
                    <option>Select Any Country</option>
                    <option>China</option>
                    <option>Russia</option>
                    <option>France</option>
                    <option>Paris</option>
                    <option>Germany</option>
                </select>
            </td>
            <td><input type="button" data-item="country1" class="button" value="Go" /></td>
        </tr>
         <tr>
            <td>Application Name</td>
            <td>
                <select id="country2">
                    <option>Select Any Country</option>
                    <option>Sri Lanka</option>
                    <option>South Africa</option>
                    <option>Ireland</option>
                    <option>Spain</option>
                    <option>Serbia</option>
                </select>
            </td>
            <td><input type="button" data-item="country2" class="button" value="Go" /></td>
        </tr>
    </table>
    <div id="output" style="color:red"></div>
4

2 回答 2

1

为选择和按钮分配动态“id” 

  var n =1;
   $("table tr input.button").each(function(n){
      $(this).attr("id" , "button"+n);
      $(this).parent().find("select").attr("id" , "country"+n);
   });

现在点击

  var y =1;
  $("table tr input.button").each(function(y){
      $("#button"+y).live('click', function(){
         alert($("#country"+y+" option:selected").index());
       });
   });
于 2013-07-03T09:50:55.630 回答
0

我希望这是你所期待的......试试这个

$("table tr td").each(function(n){
     var id = $(this).find("select").attr("id");
     if(id)
        $("#output").append($("#"+id+" :selected").val()+"<br>");
   });
}

用小提琴检查：http: //jsfiddle.net/tamilmani/QrbWy/

于 2013-07-03T10:04:15.237 回答