[英]How to detect in jquery which button element was clicked inside a php loop?
So my code is something like this:- 所以我的代码是这样的:
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
}
?>
In Jquery
I want to detect which button was clicked and based on that button I want to take the input field entered by user. 在Jquery
我想检测单击了哪个按钮,并根据该按钮获取用户输入的输入字段。
You can do it like below (one example):- 您可以按照以下方式进行操作(一个示例):-
$(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>
Note:- class
is treated as group-selector while id
is treated as individual-selector in Jquery
.Thanks 注意:-在Jquery
class
被视为组选择器,而id
被视为个人选择器。
You could try something like the below: 您可以尝试以下操作:
$(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>
Since id should be unique, Use class attribute instead of id and try below code: 由于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
}
?>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.