如何在jQuery中檢測在php循環中單擊了哪個按鈕元素？

Question

所以我的代碼是這樣的：

for($i=0;$i<$length;$i++){
?>
<div id="scoreDiv">
    <input type="text"  name="myscore"  placeholder="Enter your score" required>
    <input type="text"  name="oppoScore"  placeholder="Your opponent score" required>
    <input id="submitScore" type="submit" value="submit" >
</div>
<?php
}
?>

在Jquery我想檢測單擊了哪個按鈕，並根據該按鈕獲取用戶輸入的輸入字段。

Answer 1

您可以按照以下方式進行操作（一個示例）：-

 $(document).ready(function(){ $('.submitScore').click(function(e){ e.preventDefault(); alert($(this).prev().attr('name')); }); });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="scoreDiv"> <input type="text" name="myscore" placeholder="Enter your score" required> <input type="text" name="oppoScore" placeholder="Your opponent score" required> <input class="submitScore" type="submit" value="submit" > </div> <div id="scoreDiv"> <input type="text" name="myscore1" placeholder="Enter your score1" required> <input type="text" name="oppoScore1" placeholder="Your opponent score1" required> <input class="submitScore" type="submit" value="submit" > </div>

注意：-在Jquery class被視為組選擇器，而id被視為個人選擇器。

Answer 2

您可以嘗試以下操作：

 $(function(){ $(".js-btn").on("click",function(){ var btn = $(this); var txtBoxes = btn.siblings('input'); console.log($(txtBoxes[0]).val()); console.log($(txtBoxes[1]).val()); }); })

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="scoreDiv"> <input type="text" name="myscore" placeholder="Enter your score" required> <input type="text" name="oppoScore" placeholder="Your opponent score" required> <input id="submitScore" type="submit" value="submit" class="js-btn" > </div> <div id="scoreDiv"> <input type="text" name="myscore" placeholder="Enter your score" required> <input type="text" name="oppoScore" placeholder="Your opponent score" required> <input id="submitScore" type="submit" value="submit" class="js-btn" > </div> <div id="scoreDiv"> <input type="text" name="myscore" placeholder="Enter your score" required> <input type="text" name="oppoScore" placeholder="Your opponent score" required> <input id="submitScore" type="submit" value="submit" class="js-btn" > </div> <div id="scoreDiv"> <input type="text" name="myscore" placeholder="Enter your score" required> <input type="text" name="oppoScore" placeholder="Your opponent score" required> <input id="submitScore" type="submit" value="submit" class="js-btn" > </div>

Answer 3

由於id應該是唯一的，因此請使用class屬性而不是id並嘗試以下代碼：

<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script type="application/javascript">
    $(document).ready(function () {
        $('.submitScore').on('click',function () {
            var div_el = $(this).parent('.scoreDiv');
            var myscore = div_el.find('input[name="myscore"]').val();
            var oppoScore = div_el.find('input[name="oppoScore"]').val();

            alert(myscore+'----'+oppoScore);
            return false;
        })
    });
</script>
</head>





<?php
for($i=0;$i<5;$i++){
?>
<div class="scoreDiv">

<input type="text"  name="myscore"  placeholder="Enter your score" required>
<input type="text"  name="oppoScore"  placeholder="Your opponent score" required>
<input class="submitScore" type="submit" value="submit" >

</div>
<?php
}
?>

如何在jQuery中檢測在php循環中單擊了哪個按鈕元素？

問題描述

3 個解決方案

解決方案1
2 已采納 2017-02-09 07:20:46

解決方案2
1 2017-02-09 07:21:24

解決方案3
0 2017-02-09 07:31:21

如何在jQuery中檢測在php循環中單擊了哪個按鈕元素？

問題描述

3 個解決方案

解決方案1 2 已采納 2017-02-09 07:20:46

解決方案2 1 2017-02-09 07:21:24

解決方案3 0 2017-02-09 07:31:21

解決方案1
2 已采納 2017-02-09 07:20:46

解決方案2
1 2017-02-09 07:21:24

解決方案3
0 2017-02-09 07:31:21