Подтвердить что ты не робот

Как передать аргументы анонимным функциям в JavaScript?

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

Проверьте этот пример кода, и я думаю, вы увидите, что я имею в виду:

<input type="button" value="Click me" id="myButton" />

<script type="text/javascript">
    var myButton = document.getElementById("myButton");
    var myMessage = "it working";
    myButton.onclick = function(myMessage) { alert(myMessage); };
</script>

При нажатии кнопки появляется сообщение: it working. Однако переменная myMessage внутри анонимной функции имеет значение null.

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

4b9b3361

Ответ 1

Ваш конкретный случай можно просто исправить, чтобы работать:

<script type="text/javascript">
  var myButton = document.getElementById("myButton");
  var myMessage = "it working";
  myButton.onclick = function() { alert(myMessage); };
</script>

Этот пример будет работать, поскольку анонимная функция, созданная и назначенная как обработчик элемента, будет иметь доступ к переменным, определенным в контексте, где он был создан.

Для записи обработчик (который вы назначаете через свойство onxxx) ожидает, что единственный аргумент принимает объект события, передаваемый DOM, и вы не можете принудительно передать другой аргумент там

Ответ 2

То, что вы сделали, не работает, потому что вы привязываете событие к функции. Таким образом, это событие, которое определяет параметры, которые будут вызываться при поднятии события (т.е. JavaScript не знает о вашем параметре в функции, которую вы привязали к onclick, поэтому ничего не может передать в нее).

Вы можете сделать это, однако:

<input type="button" value="Click me" id="myButton"/>

<script type="text/javascript">

    var myButton = document.getElementById("myButton");

    var myMessage = "it working";

    var myDelegate = function(message) {
        alert(message);
    }

    myButton.onclick = function() { 
        myDelegate(myMessage);
    };

</script>

Ответ 3

Ниже приведен метод использования закрытий для решения проблемы, к которой вы обращаетесь. Он также учитывает тот факт, который может изменить сообщение с течением времени, не затрагивая привязку. И он использует jQuery для краткости.

var msg = (function(message){
  var _message = message;
  return {
    say:function(){alert(_message)},
    change:function(message){_message = message}
  };
})("My Message");
$("#myButton").click(msg.say);

Ответ 4

Удаление параметра из анонимной функции будет доступно в теле.

    myButton.onclick = function() { alert(myMessage); };

Для получения дополнительной информации о "закрытии javascript"

Ответ 5

Обработчики событий ожидают один параметр, который является событием, которое было запущено. Вы переименовываете это в "myMessage", и поэтому вы предупреждаете объект события, а не ваше сообщение.

Закрытие может позволить вам ссылаться на переменную, которую вы определили вне функции, однако, если вы используете JQuery, вы можете посмотреть ее специфический для конкретного события API, например.

http://docs.jquery.com/Events/bind#typedatafn

У этого есть возможность передать свои собственные данные.

Ответ 6

<input type="button" value="Click me" id="myButton" />

<script type="text/javascript">
    var myButton = document.getElementById("myButton");

    myButton.myMessage = "it working";

    myButton.onclick = function() { alert(this.myMessage); };


</script>

Это работает в моем тестовом наборе, который включает в себя все, начиная с IE6+. Анонимная функция знает объект, к которому он принадлежит, поэтому вы можете передавать данные с вызывающим его объектом (в данном случае myButton).

Ответ 7

Пример:

<input type="button" value="Click me" id="myButton">
<script>
    var myButton = document.getElementById("myButton");
    var test = "zipzambam";
    myButton.onclick = function(eventObject) {
        if (!eventObject) {
            eventObject = window.event;
        }
        if (!eventObject.target) {
            eventObject.target = eventObject.srcElement;
        }
        alert(eventObject.target);
        alert(test);
    };
    (function(myMessage) {
        alert(myMessage);
    })("Hello");
</script>

Ответ 8

Делегаты:

function displayMessage(message, f)
{
    f(message); // execute function "f" with variable "message"
}

function alerter(message)
{
    alert(message);
}

function writer(message)
{
    document.write(message);
}

Запуск функции displayMessage:

function runDelegate()
{
    displayMessage("Hello World!", alerter); // alert message

    displayMessage("Hello World!", writer); // write message to DOM
}

Ответ 9

Вы создали новую анонимную функцию, которая принимает один параметр, который затем присваивается локальной переменной myMessage внутри функции. Поскольку никакие аргументы фактически не передаются, а аргументы, которые не переданы, становятся равными нулю, ваша функция просто делает предупреждение (null).

Ответ 10

Если вы пишете его как

myButton.onclick = function() { alert(myMessage); };

Это сработает, но я не знаю, отвечает ли это на ваши вопросы.