Question

我正在编写一个代码，其中html的onclick应该会为javascript变量分配一个值，该值会导致函数触发。

<script type="text/javascript">
function set_str(numb)
 {
   if(numb == 1)
   var str_in_func = 'a.tab_1';
   else if(numb == 2)
      var str_in_func = 'a.tab_2';
   return str_in_func;
}
jQuery(window).bind("load", function() {
str = set_str(num);

// When a link is clicked
$(str).click(function () {


// switch all tabs off
$(".active").removeClass("active");

// switch this tab on
$(this).addClass("active");

// slide all content up
$(".content").slideUp();

// slide this content up
var content_show = $(this).attr("title");
$("#"+content_show).slideDown();

});

});
</script>

我希望点击下面的链接时，javascript变量str的值为'a.tab_1'

<a href="#" title="content_1" onclick="var num = 1; return false;" class="tab_1 active" id="ma_link">Topics</a>

这似乎不起作用。上面的jQuery函数根本没有运行。

Answer 1

有一个更简单的方法，不需要HTML属性的所有混乱：

<强> HTML：

<nav>
    <a href="javascript:;" class="tab">tab 1</a>
    <a href="javascript:;" class="tab">tab 2</a>
</nav>
<div id="content">
    <section>Content 1</section>
    <section>Content 2</section>
</div>

<强> JS

$(document).ready(function() {
    $('.tab').on('click', function() {
        $('.active').removeClass('active');
        $(this).addClass("active");
        $('#content section')
            .slideUp()
            .eq($(this).index()).slideDown()
        ;
    });
});

See demonstration here.

Answer 2

<a href="#" title="content_1" onclick="var num = 1; return false;" class="tab_1 active" id="ma_link">Topics</a>

问题是变量名称前的var。删除它，你会没事的。 var告诉javascript您声明了本地范围的变量，而不是窗口的上下文，使其在当前上下文之外不可用。

你想：

<a href="#" title="content_1" onclick="num = 1; return false;" class="tab_1 active" id="ma_link">Topics</a>

如何使用onclick html分配变量？

2 个答案: