2008-12-01 3 views
6

В JQuery, если я назначу class=auto_submit_form к форме, он будет представлен каждый раз, когда какой-либо элемент изменен со следующим кодом:представить форму, когда элементы меняют

/* automatically submit if any element in the form changes */ 
$(function() { 
    $(".auto_submit_form").change(function() { 
    this.submit(); 
    }); 
}); 

Однако, если я хочу, чтобы в форме если только указанные элементы изменены:

/* submit if elements of class=auto_submit_item in the form changes */ 
$(function() { 
    $(".auto_submit_item").change(function() { 
    $(this).parents().filter("form").submit(); 
    }); 
}); 

Я просто изучаю jQuery. Есть лучший способ сделать это?

+0

это специальный плагин, который вы используете, или это некоторые встроенные функции jQuery, о которых я никогда не слышал? – nickf 2008-12-01 02:22:04

ответ

20
/* submit if elements of class=auto_submit_item in the form changes */ 
$(function() { 
    $(".auto_submit_item").change(function() { 
    $("form").submit(); 
    }); 
}); 

Предполагается, что у вас есть только одна форма на странице. Если нет, вам нужно будет выбрать форму, которая является предком текущего элемента, используя $(this).parents("form").submit()

+7

используя "this.form.submit();" будет еще лучше, потому что вам не нужно будет создавать экземпляр объекта jQuery. – nickf 2008-12-01 02:20:55

10

Вы можете использовать выражение в методе parents() для фильтрации родителей. Следовательно, это могло бы быть немного более эффективным:

/* submit if elements of class=auto_submit_item in the form changes */ 
$(".auto_submit_item").change(function() { 
    $(this).parents("form").submit(); 
}); 
4

Я хотел бы дать идентификатор в виде:

$(".auto-submit-item").change(function() { 
    $("form#auto-submit").submit(); 
}); 
3

я придумал общий подход к этому:

$('.autoSubmit, .autoSubmit select, .autoSubmit input, .autoSubmit textarea').change(function() { 
    const el = $(this); 
    let form; 

    if (el.is('form')) { form = el; } 
    else { form = el.closest('form'); } 

    form.submit(); 
}); 

All элементы формы:

<form class="autoSubmit"> 
    <select><option>1</option><option>2</option></select> 
</form> 

Только инди- idual elements

<form> 
    <select class="autoSubmit"><option>1</option><option>2</option></select> 
</form> 
Смежные вопросы