Question

我从SQL查询循环数据并将其全部放入表单中。从SQL中为每个数据集检索三个变量：BetID和BetHome以及BetAway。

现在我想改变表单中的数据并将其传递给ajax。

问题：只更改了第一个数据集，所有其他数据集保持不变。

知道我的JavaScript代码有什么问题吗？

<script type="text/javascript">
    $(document).ready(function(){
        $("#betting").click(function(){

                var val1 = $("#BetID").val();
                var val2 = $("#BetHome").val();
                var val3 = $("#BetAway").val();

                $.ajax({
                    type: "POST",
                    url: "betting-ajax.php",
                    data: { BetID: val1, BetHome: val2, BetAway: val3 },
                    success: function(html){
                        $("#hide").hide();
                        $("#new").html(html);
                    }
                });
                return false;
        });
    });
</script>

PHP基本上就是这种结构：

<form id="betting">
MY SQL query starting here {
<select id="BetHome"><option value="1">1</option></select>
<select id="BetAway"><option value="1">1</option></select>
<input type="hidden" name="BetID" id="BetID" value="<?php echo $BetID ?>"

<button type="submit" name="submit">Save</button>

<?php } ?>
</form>

正如这个表格（表格中的查询）和上面解释的javascript代码所说的那样，只有第一个数据集被改变，所有数据集都没有改变。

Answer 1

你能尝试这样的事吗？

<script type="text/javascript">
    $(document).ready(function(){
          var val1 = $("#BetID").val();
          var val2 = $("#BetHome").val();
          var val3 = $("#BetAway").val();

          $("#BetHome").on("change", function(){
               val1 = $(this).val();
          });

          $("#BetAway").on("change", function(){
               val1 = $(this).val();
          })
        $("#betting").click(function(){
                $.ajax({
                    type: "POST",
                    url: "betting-ajax.php",
                    data: { BetID: val1, BetHome: val2, BetAway: val3 },
                    success: function(html){
                        $("#hide").hide();
                        $("#new").html(html);
                    }
                });
                return false;
        });
    });
</script>

原因是您需要获取已更改下拉列表的新值。

Answer 2

不确定我是否理解你的要求但是无论何时你将html转储到dom中，你需要重新绑定你的事件，如果新的html正在替换那些挂有事件的东西。

所以在此之后：

$("#new").html(html);

您需要再次绑定click事件：

$("#betting").click(function()...

AJAX - 循环变量，只传递第一个结果

2 个答案: