0

テーブルの列であるボタンがクリックされるたびにアラートをオフにしようとしています。

ただし、アラートは、ユーザーが一番上の行のボタンをクリックした場合にのみ機能します。その下のすべての行は機能しません。どうして？！

<span class="inline" id="part-name" style="font-size:20px;font-weight:bold;"> {{unipart.part}}</span>



    <td id ="Buy">
                <a class="btn btn-warning" href="{{offer.buynow_url}}">BUY NOW </a>
            </td>


<script type="text/javascript">
$('#Buy').click(function() {
   var myPart = $('#part-name').text();
   alert (myPart);
});
</script>

タグとタグのid="Buy"両方で試したことに注意してください。tda

4

4 に答える 4

1

複数の DOM 要素にバインドする場合は、代わりにそれらが共有するクラスにバインドします (新しいクラスを作成し、各要素でそのクラスを使用します)。

あなたの DOM 構造はやや混乱しているように見えますが、私が正しく理解していれば、これでうまくいくはずです。

<span class="inline" id="part-name" class="part-name" style="font-size:20px;font-weight:bold;"> {{unipart.part}}</span>

<td class="buy" id ="Buy">
            <a class="btn btn-warning" href="{{offer.buynow_url}}">BUY NOW </a>
        </td>


<script type="text/javascript">
$('.buy').click(function() {
   var myPart = $(this).closest('tr').children('.part-name').text();
   alert (myPart);
});
</script>
于 2013-03-14T16:05:20.920 に答える
0

おそらく、次のようなことをしたいと思うかもしれません。

   <span class="inline" id="part-name-{{partID}}" style="font-size:20px;font-weight:bold;"> {{unipart.part}}</span>



    <td class ="Buy">
                <a class="btn btn-warning" href="{{offer.buynow_url}}" partId="{{partID}}">BUY NOW </a>
            </td>


<script type="text/javascript">
$('.Buy').click(function() {
   var myPart = $("#part-name-"+$(this).attr("partId")).text();
   alert (myPart);
});
</script>

HTML5を使用していない限り、これにより検証が失敗します。

于 2013-03-14T16:10:21.110 に答える
0

これは、ID で を選択しているためです。ID は一意であるはずなので、jQuery は最初の ID を取得します。クラスを使用すると、よりうまく機能します。

<span class="inline" id="part-name" style="font-size:20px;font-weight:bold;"> {{unipart.part}}</span>

<td class='Buy'>
  <a class="btn btn-warning" href="{{offer.buynow_url}}">BUY NOW </a>
</td>


<script type="text/javascript">
$('.Buy').click(function() {
  var myPart = $('#part-name').text();
  alert (myPart);
});
</script>
于 2013-03-14T16:07:35.600 に答える
0

ID「購入」の代わりに、クラス名「購入」を指定してから、以下のコードを使用します 

 $('.Buy').on('click',function(){
     alert($('#part-name').text());
 });
于 2013-03-14T16:06:07.437 に答える