如何在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