как связать одну и ту же функцию JavaScript с изменением ввода и нажатием кнопки - PullRequest
0 голосов
/ 02 апреля 2012

У меня есть следующий скрипт

$(function(){
    $('.input1_class, .input2_class, <many other input classes go here>').bind('change', function(){
        $.ajax({
            url: "<%= update_fields_projects_url %>",
            data: {
                input1: $('.input1_class').val(),
                input2: $('.input2_class').val(),
                <other inputs go here>
            }
        });
    });
});

, он работает нормально, поэтому, если какой-либо ввод изменяется, выполняются правильные действия, и обновление ajax также работает нормально.

Теперь я хотелчтобы вызвать тот же запрос ajax нажатием следующей кнопки

<input type=button id=update_button_id value="Update Fields" class=update_button_class>

Я собирался дублировать предыдущую функцию, изменив заголовок следующим образом, который, я думаю, будет работать

$(function(){
    $('.update_button_class').bind('click', function(){
        $.ajax({
            url: "<%= update_fields_projects_url %>",
            data: {
                input1: $('.input1_class').val(),
                input2: $('.input2_class').val(),
                <other inputs go here>
            }
        });
    });
});

но я подумал, что это не очень хорошее решение, потому что любые последующие изменения должны будут выполняться в обеих функциях одновременно.

Интересно, есть ли лучший способ написать эту функцию только один раз и вызвать ее?либо из ввода "изменить", либо из нажатия кнопки "

Update1:

Я изменил на это

function updateFields(){
    $.ajax({
        url: "<%= update_fields_projects_url %>",
        data: {
            input1: $('.input1_class').val(),
            input2: $('.input2_class').val(),
            <other inputs go here>
        }
    });
}

$('.input1_class, .input2_class, <many other input classes go here>').change(updateFields);

<input type=button id=apply_button_id value="Apply Updates" class=apply_button_class onClick="updateFields();">

Update2:

Я такжепробовал

$('.input1_class, .input2_class, ...').bind('change',updateFields);

и это тоже не сработало

Update3:

Вот что у меня сработало

function updateFields(){
    $.ajax({
        url: "<%= update_fields_projects_url %>",
        data: {
            input1: $('.input1_class').val(),
            input2: $('.input2_class').val(),
            <other inputs go here>
        }
    });
}

$(function(){
    $('.input1_class, .input2_class, ...').bind('change',updateFields);
});

<input type=button id=apply_button_id value="Apply Updates" class=apply_button_class onClick="updateFields();">

1 Ответ

2 голосов
/ 02 апреля 2012

Просто дайте функции имя:

function func(){

}

$("...").change(func);

<a href="" onclick="func()">Blah</a>

Или даже:

<a id="link">Blah</a>

А потом:

$("...").change(func);

$("#link").click(func);
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...