Javascript 定义的函数是；“未定义”；_Javascript_Html

Javascript 定义的函数是；“未定义”；

javascript html

Javascript 定义的函数是；“未定义”；,javascript,html,Javascript,Html,下面的函数是在我的页面的head标签中定义的 <script type="text/javascript"> $(document).ready(function(){ function greenTab(input){ if ($input === 'second') { $('#green').css({'display':'none'}); $('#2ndgreen').css({'display':'initial'});

下面的函数是在我的页面的head标签中定义的

<script type="text/javascript">     
$(document).ready(function(){

function greenTab(input){
    if ($input === 'second') {
        $('#green').css({'display':'none'});
        $('#2ndgreen').css({'display':'initial'});
    } else if ($input === 'first') {
        $('#2ndgreen').css({'display':'none'});
        $('#green').css({'display':'initial'});
    }
}   
});
</script>


$（文档）.ready（函数（）{
功能绿色选项卡（输入）{
如果（$input=='second'）{
$（'#绿色'）.css（{'display'：'none'}）；
$（'2ndgreen'）.css（{'display'：'initial'}）；
}else如果（$input==='first'）{
$（'2ndgreen'）.css（{'display'：'none'}）；
$（'#绿色'）.css（{'display'：'initial'}）；
}
}   
});

我这样称呼它：

<div class="container">
    <ul class="nav nav-pills">
        <li class="active" onclick="greenTab('first')"><a>1st Green</a></li>
        <li class="active" onclick="greenTab('second')"><a>2nd Green</a></li>                         
    </ul>
</div>



第一个绿色
第二个绿色

问题：Firebug说函数没有定义。预期结果：对于要定义的功能。

为什么它会被破坏：

onclick

属性期望函数在全局范围内公开

由于您在

ready

函数中定义了

greenTab

，因此它是在该函数的范围内定义的，而不是在全局范围内，因此在全局范围内找不到它

如何修复它：要么：

在全球范围内公开它。（不要这样做）

通过JS而不是HTML添加事件侦听器（可能会这样做）

由于您使用的是jQuery，因此应添加如下事件处理程序：

$('some selector').click(function () {
    greenTab('first');
});

某些选择器现在应该是

”。容器ul li:n类型（1）

，但我建议在这些元素中添加一些内容，以便更好地进行选择，例如：

<div class="container">
    <ul class="nav nav-pills">
        <li class="active first-green"><a>1st Green</a></li>
        <li class="active second-green"><a>2nd Green</a></li>                         
    </ul>
</div>

您还需要对第二个单击处理程序执行相同的操作。

为什么它会损坏：

onclick