如何将两个单独的 javascript 合并为一个？

Posted 2023-02-19

【中文标题】如何将两个单独的 javascript 合并为一个？

【英文标题】：How can I merge two separate javascripts in one?

【发布时间】：2014-06-25 20:55:30

【问题描述】：

如何将两个独立的 javascript 合并为一个？ 我有两个单独的 javascript。一个将表单数据发送到 post.php 页面而不刷新页面并使用 (div.php) 刷新 DIV 内容，但第二个禁用相应的表单提交按钮。如何将此代码合并为一个？ （并不是说我在一页中有许多具有不同 ID 的表单）。 问题出在 IE9 上，此脚本在其中双重提交数据！！！

$(function() 
  $('form').on('submit', function(e) 
    $.ajax(
      type: 'post',
      url: 'post.php',
      data: $(this).serialize(),
      success: function(returnedData) 
        $('#sidebar').load('div.php');
      
    );
    e.preventDefault();
  );
);
$(document).ready(function() 
  $('input[type=submit]').click(function() 
    $(this).prop("disabled", true);
    $(this).val("Selected");
    $(this).closest('form').trigger('submit');
  );
);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

【问题讨论】：

只需删除此代码);</script><script>$(document).ready(function ()

当你删除中间的</script><script>时，你已经合并了它们。

并使用一个 $(function () ALL CODE ); 而不是两个类似的处理程序 ($(function () ~= $(document).ready(function () )。

你应该提供一个小提琴。

@dschazam 无需提琴 - 将代码放入问题中是正确的。此外，它很容易理解。

【参考方案1】：

删除

</script>

<script>

你已经完成了;-)

不过我会更进一步：

$(document).ready(function () 
    $('form').on('submit', function (e) 
        e.preventDefault();
        $.ajax(
            type: 'post',
            url: 'post.php',
            data: $(this).serialize(),
            success: function (returnedData) 
                $('#sidebar').load('div.php');

            
        );
        return false;
    );

    $('input[type=submit]').click(function () 
        $(this).prop("disabled", true);
        $(this).val("Selected");
        $(this).closest('form').trigger('submit');
    );
);

【讨论】：

@MilindAnantwar Is 仍在忙于在我的编辑中缩进 OP 的代码，而您的评论不再适用；-)

发布jsfiddle 的链接或编辑问题以包含相关（！）代码，以便我们准确地重现问题。此外，您可能希望将 preventDefault() 调用更改为仅返回 false （请参阅我的编辑）或将 preventDefault() 移动“向上”。

见event.preventDefault() vs. return false

【参考方案2】：

要合并这两个代码，只需删除代码

);</script><script>$(document).ready(function () 

为了防止在ie9中重复提交，使用return false：

$('form').on('submit', function (e) 
e.preventDefault();
$.ajax(
    type: 'post',
    url: 'post.php',
    data: $(this).serialize(),
    success: function (returnedData) 
        $('#sidebar').load('div.php');

    
);
return false;);