dtid30526
2017-02-09 07:15
浏览 69

如何在jquery中检测在php循环中单击了哪个按钮元素?

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.

图片转代码服务由CSDN问答提供 功能建议

所以我的代码是这样的: -

  for  ($ i = 0; $ i&lt; $ length; $ i ++){
?&gt; 
&lt; div id =“scoreDiv”&gt; 
&lt; input type =“text”name =“myscore”placeholder =“ 输入您的分数“required&gt; 
&lt; input type =”text“name =”oppoScore“placeholder =”您的对手得分“必需&gt; 
&lt; input id =”submitScore“type =”submit“value =”submit“  &gt; 
&lt; / div&gt; 
&lt;?php 
} 
?&gt; 
   
 
 

Jquery 中我想要 检测单击了哪个按钮,并根据该按钮,我想获取用户输入的输入字段。

  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

3条回答 默认 最新

  • dongshuxi3105 2017-02-09 07:20
    已采纳

    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

    </div>
    
    点赞 打赏 评论
  • duai4379 2017-02-09 07:21

    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>

    </div>
    
    点赞 打赏 评论
  • donglu5000 2017-02-09 07:31

    Since id should be unique, Use class attribute instead of id and try below code:

    <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
    }
    ?>
    
    点赞 打赏 评论

相关推荐 更多相似问题