jquery:在选择更改时按名称调用函数
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/18239387/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jquery: Call function by name on select change
提问by Perocat
I'm trying to call a function by name .onchange
of a select but nothing happens. When the function is describled after the attribute, it works.
我正在尝试按.onchange
选择的名称调用函数,但没有任何反应。当函数在属性之后被描述时,它就起作用了。
THIS DOESN'T WORK
这行不通
HTML:
HTML:
<select id="numb">
<option value="1">1</option>
<option value="2">2</option>
</select>
SCRIPT:
脚本:
<script type="text/javascript">
$('#numb').change(testMessage);
</script>
<script type="text/javascript">
function testMessage(){
alert('Hello');
}
</script>
THIS WORKS
这有效
HTML:
HTML:
<select id="numb">
<option value="1">1</option>
<option value="2">2</option>
</select>
SCRIPT:
脚本:
<script type="text/javascript">
$('#numb').change(function(){
alert('Hello')
});
</script>
EDIT:
编辑:
Ok, for all those who said me to include the function on the same script. This is not possible because the testMessage()
function is in an external .js
script included on the <head>
of the HTML.
好的,对于那些让我在同一个脚本中包含该函数的人。这是不可能的,因为该testMessage()
函数位于HTML的外部.js
脚本中<head>
。
回答by Selvakumar Arumugam
It is because the handler testMessage
is not defined when binding it to the change event.
这是因为在将处理程序testMessage
绑定到更改事件时未定义处理程序。
It should work if it was in the same script context like below,
如果它在与下面相同的脚本上下文中,它应该可以工作,
<script type="text/javascript">
$('#numb').change(testMessage);
function testMessage(){
alert('Hello');
}
</script>
Code inside <script></script>
are executed one by one progressive from top and testMessage
function doesn't exist inside the first <script></script>
.
里面<script></script>
的代码是从上往下逐个执行的,第一个testMessage
里面不存在函数<script></script>
。
You have couple of options here,
你在这里有几个选择,
Put it inside an anonymous function which will let your script to resolve the
testMessage
function later. [As suggested in Optimus Primeanswer]<script type="text/javascript"> $('#numb').change(function () { testMessage }); </script> <script type="text/javascript"> function testMessage(){ alert('Hello'); } </script>
Include the script that has
testMessage
function above thescript
that binds the testMessage like below,<script type="text/javascript"> function testMessage(){ alert('Hello'); } </script> <script type="text/javascript"> $('#numb').change(testMessage); </script>
将它放在一个匿名函数中,这将使您的脚本
testMessage
稍后解析该函数。[如擎天柱答案中所建议]<script type="text/javascript"> $('#numb').change(function () { testMessage }); </script> <script type="text/javascript"> function testMessage(){ alert('Hello'); } </script>
包含
testMessage
上面具有script
绑定 testMessage 的函数的脚本,如下所示,<script type="text/javascript"> function testMessage(){ alert('Hello'); } </script> <script type="text/javascript"> $('#numb').change(testMessage); </script>
回答by Optimus Prime
Instead try ,
而是尝试,
<script type="text/javascript">
$('#numb').change(function(){
testMessage();
});
</script>
回答by Zaheer Ahmed
Working Jsfiddletry this:
工作 Jsfiddle试试这个:
<script type="text/javascript">
$('#numb').on('change',testMessage);
</script>
回答by Jonny Sooter
Try this and place in the same script tag:
试试这个并放在同一个脚本标签中:
<script type="text/javascript">
$(document).ready(function(){
$('#numb').change(testMessage);
function testMessage(){
alert('Hello');
}
});
</script>
回答by Matthew R.
You must define a callback on the change function.
您必须在更改函数上定义回调。
<script type="text/javascript">
$('#numb').change(function(){
testMessage();
);
function testMessage(){
alert('Hello');
}
</script>
That should fix your problem.
那应该可以解决您的问题。
回答by BillPull
I dont think your reference exists yet to the function here is two ways you could do it. I put the namespaced version as a suggestion because it might help clean up your code in general.
我不认为您对这里的功能的引用存在两种方法。我将命名空间版本作为建议,因为它可能有助于清理您的代码。
HTML:
HTML:
<select id="numb">
<option value="1">1</option>
<option value="2">2</option>
</select>
SCRIPT:
脚本:
// Namespaced and using Proxy
// 命名空间并使用代理
<script type="text/javascript">
var project = project || {};
project = {
testMessage: function (event) {
alert('Hello');
}
};
$('#numb').change($.proxy(project.testMessage, project));
</script>
// Just declared
// 刚刚声明
<script type="text/javascript">
function testMessage(){
alert('Hello');
}
$('#numb').change(function(event) {
testMessage();
});
</script>
If your method is in another file make sure you include that file before the one with the event binding. Are you getting any console errors?
如果您的方法在另一个文件中,请确保在具有事件绑定的文件之前包含该文件。您是否收到任何控制台错误?