javascript AJAX post脚本不适用于嵌套表单中的输入

6tdlim6h 于 2023-05-05 发布在 Java

关注(0)|答案(1)|浏览(177)

我看不出这里有什么错：

<form  class=""  action="" method="post">
               <form id="kod"  action="" method="post">
      <input  placeholder="SK"  name="SK" type="text" class="form-control">
      <button   type="button" name="submit" >Submit form </button>
      <span ><?php echo $kal ?></span>
    </form>
<input placeholder="HN" name="HN" type="text" class="form-control">
<button 
 type="submit" name="add" value="add" class="btn  btn-md">ADD</button>
    </form>
    <!-- AJAX script -->
    <script>
    $(document).ready(function(){
        $('#kod').submit(function(event){
            event.preventDefault(); 
            var SK = $('input[name=SK]').val(); 
            $.ajax({
                type: 'POST',
                url: 'repAjax.php', 
                data: { SK: SK }, 
                success: function(response){
                    alert(response);
                }
            });
        });
    });

脚本根本不起作用。是关于嵌套形式的吗？如果是，什么可能是这个替代品。它通过提交按钮 AJAX 后SK。但我只是希望它没有重新加载页面后。先谢谢你了。

JavaScript

来源：https://stackoverflow.com/questions/76170760/ajax-post-script-doesnt-work-for-input-inside-nested-form

1条答案

按热度按时间

6ju8rftf1#

你的javascript不能工作，因为你的javascript注册了一个submit事件，表单必须使用按钮实际启动提交操作。
具有type="button"属性的按钮不执行任何操作。**从JS的Angular 来看，**它是一个没有动作的死按钮。你有以下3个选择，为你工作。

第一个选项

将按钮的type属性从button更改为submit。

<button id="kod-button" type="submit" name="submit" >Submit form </button>

您可以使用现有的javascript代码与上面的按钮。

第二选项

添加一个onclick属性，该属性调用一个javascript函数，如下所示。

<button id="kod-button" onclick="submitKodForm()" type="button" name="submit" >Submit form </button>

你的javascript应该像下面这样

<script>
let submitKodForm = function(){
   var SK = $('#kod input[name=SK]').val(); 
   $.ajax({
      type: 'POST',
      url: 'repAjax.php', 
      data: { SK: SK }, 
      success: function(response){
           alert(response);
      }
   });
};

第三个选项

在按钮中添加id属性，并在javascript中注册onclick事件。

<button id="kod-button" type="button" name="submit" >Submit form </button>

你的JavaScript应该像下面这样。

<script>
    $(document).ready(function(){
        $('#kod-button').on('click', function(){
            var SK = $('#kod input[name=SK]').val(); 
            $.ajax({
                type: 'POST',
                url: 'repAjax.php', 
                data: { SK: SK }, 
                success: function(response){
                    alert(response);
                }
            });
        });
    });
</script>

赞(0）回复(0）举报 2023-05-05

我来回答

javascript AJAX post脚本不适用于嵌套表单中的输入

1条答案

相关问题

热门标签

最新问答