Как передать аргументы анонимным функциям в 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 использует много анонимных функций, что является лучшим способом передать этот аргумент?
Ответы
Ответ 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); };
Это сработает, но я не знаю, отвечает ли это на ваши вопросы.