Question

**场景：**

我在一页中有3个表单（设置）
当我单击任何按钮时，其他两种形式都被jquery设置为隐藏

**问题：**

当我提交第二个或第三个表单时，尽管所有表单名称都不同
其他两种形式甚至都不响应jquery和preventDefault方法

第一份表单提交代码：

$('form[name=noteForm]').submit(function(e){    
    var postData = $(this).serialize();
    $.ajax({
        url: baseURL + "admin/Settings/ChangeNotificationSettings",
        type:'post',
        data:postData,
        success:function(data){
            SetNotificationModal('settings successfully updated');
        } ,
        error:function(data){
            alert(data);
        }
    });
    e.preventDefault();
});

第二种形式：

$('form[name=socialMedia]').submit(function(evt){
        evt.preventDefault();
        var postData = $(this).serialize();
        $.ajax({
            url:baseURL +"admin/settings/change_social_media",
            type:'post',
            data:postData,
            success:function(){
                SetNotificationModal('social media settings updated');
            }    
        });    
    });

Answer 1

您必须在表单标签中使用ID

这是您的第一个表单通知

$('#form1').submit(function(e){
  var postData = $(this).serialize();

  $.ajax({
    url: baseURL + "admin/Settings/ChangeNotificationSettings",
    type: 'post',
    data: postData,
    success:function(data){
      SetNotificationModal('settings successfully updated');
    } ,
    error:function(data){
      alert(data);
    }
  });
  e.preventDefault();
});

这是您的第二个表格SocialMedia

<form id="form2"></form>

$('#form2').submit(function(evt){
  evt.preventDefault();
  var postData = $(this).serialize();
  $.ajax({
    url:baseURL +"admin/settings/change_social_media",
    type:'post',
    data:postData,
    success:function(){
     SetNotificationModal('social media settings updated');
    }    
  });    
});

希望这对您有帮助

Answer 2

首先，请确保您所有的表格都被标签分开或关闭。如果您错过任何机会，那么它将因为嵌套表格而错过行为。

检查您的HTML

<html>
    <body>
        <form name='noteForm'>
            <button>NoteForm Submit</button>
        </form>

        <form name='socialMedia'>
            <button>SocialMedia Submit</button>
        </form>  
    </body>
</html>

您的Js

$('form[name=noteForm]').submit(function(e){


 var postData = $(this).serialize();

$.ajax({
url: baseURL + "admin/Settings/ChangeNotificationSettings",
type:'post',
data:postData,
success:function(data){

SetNotificationModal('settings successfully updated');

} ,
error:function(data){

alert(data);

}

 });


e.preventDefault();
});

/////////////第二种形式

$('form[name=socialMedia]').submit(function(evt){

 evt.preventDefault();

 var postData = $(this).serialize();

$.ajax({

url:baseURL +"admin/settings/change_social_media",

type:'post',

data:postData,

success:function(){


SetNotificationModal('social media settings updated');

}    
});    
});

提交一个表单会导致另一个表单的提交：页面中有3个HTML表单

2 个答案:

这是您的第一个表单通知

这是您的第二个表格SocialMedia