在更改时使用Jquery提交最接近的表单

我有两个

选择框

，每个框都有自己的形式。我希望这样，当用户更改

selectbox

值时，表单提交。我添加了一些控制台日志以进行调试，当我更改选择框时，似乎只显示第一个控制台，而且它从未超过提交，这使我相信那里出了问题，但我无法找出原因先发制人地说，我还想知道，对于post数据，我是否必须使用

$（this）.closest（'form'）.serialize（）

，而不是我目前拥有的

$('#usr_vcm, #usr_ma').change(function(){
    console.log('change triggered');
    $(this).closest('form').submit(function() {
        console.log('submit closest done');
        $.ajax({
            type: "POST",
            url: $(this).closest('form').attr('action'),
            data: $(this).serialize(),
            success: function(data){
                alert(data + 'hello');                    
            }
        });

    });           
});

示例HTML

<form name="usr_vcm_frm" method="post" action="framework/AJAX/config_actions.php?config=view_create_modified" class="form-inline">
  <div class="controls docs-input-sizes">
    <select name="usr_vcm" class="select-ms" id="usr_vcm">
      <option value="1">Allow</option>
      <option value="0" <?php if ($row_config['usr_view_cm'] == '0') { echo 'selected'; } ?>>Do not allow</option>
    </select>
    <span style="margin-left:5px;">users to see the name of who created/modified a post</span> </div>
</form>
<form name="usr_ma_frm" method="post" action="framework/AJAX/config_actions.php?config=user_auto_active" class="form-inline">
  <div class="controls docs-input-sizes">
    <select name="usr_ma" class="select-ms" id="usr_ma">
      <option value="1">Allow</option>
      <option value="0" <?php if ($row_config['usr_auto_activ'] == '0') { echo 'selected'; } ?>>Do not allow</option>
    </select>
    <span style="margin-left:5px;">automatic activation of users after they complete the registration form <span class="error-color">(not recommended to allow)</span></span> </div>
</form>

容许
>不允许
用户填写注册表后自动激活（不建议允许）

试试这个：

 $('#usr_vcm, #usr_ma').change(function(){
        $.ajax({
            type: "POST",
            url: $(this).closest('form').attr('action'),
            data: $(this).closest('form').serialize(),
            success: function(data){
                alert(data + 'hello');                    
            }
        });

});  

工作时请尝试以下方法：

 $('#usr_vcm, #usr_ma').change(function(){
        $.ajax({
            type: "POST",
            url: $(this).closest('form').attr('action'),
            data: $(this).closest('form').serialize(),
            success: function(data){
                alert(data + 'hello');                    
            }
        });

});  

---

工作

这里是绑定

提交

事件，而不仅仅是实际提交表单，我的意思是：

$(this).closest('form').submit(function() {...

要提交表单，您必须执行

$（this）.closest（'form'）.submit（）没有处理程序

我会这样做来处理表单提交：

    $('.form-inline').submit(function(event) {
        event.preventDefault();

        console.log('submit closest done');

        $.ajax({
            type: "POST",
            url: $(this).attr('action'),
            data: $(this).serialize(),
            success: function(data){
                alert(data + 'hello');                    
            }
        });
    });     

并提交更改表格：

$('#usr_vcm, #usr_ma').change(function(){
    $(this).closest('form').submit();
});

这里是绑定
submit
event，而不是真正提交表单，我的意思是：

$(this).closest('form').submit(function() {...

要提交表单，您必须执行
$（this）.closest（'form'）.submit（）没有处理程序

我会这样做来处理表单提交：

    $('.form-inline').submit(function(event) {
        event.preventDefault();

        console.log('submit closest done');

        $.ajax({
            type: "POST",
            url: $(this).attr('action'),
            data: $(this).serialize(),
            success: function(data){
                alert(data + 'hello');                    
            }
        });
    });     

并提交更改表格：

$('#usr_vcm, #usr_ma').change(function(){
    $(this).closest('form').submit();
});

您正在定义提交表单时要调用的事件处理程序，但从未实际提交表单。查看上的jQuery文档以了解方法签名中的区别。而是在“更改”处理程序之外定义“提交”处理程序，然后触发submit onchange：

$(function() {
    $('[name="usr_vcm_frm"], [name="usr_ma_frm"]').submit(function(e) {
        e.preventDefault();
        console.log('submit closest done');
        $.ajax({
            type: "POST",
            url: $(this).attr('action'),
            data: $(this).serialize(),
            success: function(data){
                alert(data + 'hello');                    
            }
        });
    }); 

    $('#usr_vcm, #usr_ma').change(function(){
        console.log('change triggered');
        $(this).closest('form').submit();
    });
});

您正在定义提交表单时要调用的事件处理程序，但从未实际提交表单。查看上的jQuery文档以了解方法签名中的区别。而是在“更改”处理程序之外定义“提交”处理程序，然后触发submit onchange：

$(function() {
    $('[name="usr_vcm_frm"], [name="usr_ma_frm"]').submit(function(e) {
        e.preventDefault();
        console.log('submit closest done');
        $.ajax({
            type: "POST",
            url: $(this).attr('action'),
            data: $(this).serialize(),
            success: function(data){
                alert(data + 'hello');                    
            }
        });
    }); 

    $('#usr_vcm, #usr_ma').change(function(){
        console.log('change triggered');
        $(this).closest('form').submit();
    });
});

您应该尝试$（this）.parent（'form'）或检查表单是否是第一个ancestorno这样的运气：（添加了一些HTML示例，我得到的东西）
$（this.parent（）.parent（'form'）
nope.仍然没有。document.getElementsByName（this.id+''u frm'）[0]。submit（）您应该尝试$（this）.parent（'form）或检查表单是否是第一个ancestorno这样的运气：（添加了我得到的一些HTML示例。this.parent（）.parent（'form'）
没有。仍然没有。document.getElementsByName（this.id+'u frm'）[0]。提交（）被接受为最完整的答案！谢谢you@Alex没问题！同样值得注意的是，jQuery方法既适用于
元素，也适用于整个
元素，但如果您计划向表单中添加其他元素，则最好将整个内容序列化。被认为是最完整的答案！谢谢you@Alex没问题！A同样值得一提的是，jQuery方法既适用于
元素，也适用于整个
元素，但是如果您计划向表单中添加其他元素，那么您最好将整个元素序列化。第一次投票的结果是准确的，但接受的结果更完整。谢谢！没问题，兄弟，但我看不出有多大区别答案之间：））被选为第一个正确答案，但被接受的答案更完整。谢谢！没问题，兄弟，但我看不出答案之间有多大区别：））