嗨我正在使用select class,虽然它的工作正常,但对我来说这是一个很长的过程,任何人都可以告诉我简单和简短的过程,我的代码在下面给出
<script type="text/javascript">
$(document).ready(function() {
$("#menu-item1").click(function() {
$('#menu-item1').addClass('li_select');
$('#menu-item2').removeClass('li_select');
$('#menu-item3').removeClass('li_select');
$('#menu-item4').removeClass('li_select');
});
$("#menu-item2").click(function() {
$('#menu-item1').removeClass('li_select');
$('#menu-item2').addClass('li_select');
$('#menu-item3').removeClass('li_select');
$('#menu-item4').removeClass('li_select');
});
$("#menu-item3").click(function() {
$('#menu-item1').removeClass('li_select');
$('#menu-item2').removeClass('li_select');
$('#menu-item3').addClass('li_select');
$('#menu-item4').removeClass('li_select');
});
$("#menu-item4").click(function() {
$('#menu-item1').removeClass('li_select');
$('#menu-item2').removeClass('li_select');
$('#menu-item3').removeClass('li_select');
$('#menu-item4').addClass('li_select');
});
});
</script>
答案 0 :(得分:7)
你可以这样做:
$(document).ready(function () {
var $menu = $("[id^='menu-item'");
$menu.click(function () {
$menu.removeClass('li_select');
$(this).addClass('li_select');
});
});
答案 1 :(得分:1)
palash答案的另一种选择可能是这样的(我想更具体一点):
$(document).ready(function() {
//define all your elements
var items = $('#menu-item1,#menu-item2,#menu-item3,#menu-item4');
//remove the class onclick from all items,
//and then apply it to the element that was clicked.
items.click(function() {
items.removeClass('li_select');
$(this).addClass('li_select');
});
});
答案 2 :(得分:1)
请检查链接http://jsfiddle.net/G49SQ/ ..
HTML:
<ul id="menu-item">
<li>Menu 1</li>
<li>Menu 2</li>
<li>Menu 3</li>
<li>Menu 4</li>
</ul>
JS:
$(document).on("click","#menu-item li",function(){
$("#menu-item").find("li").removeClass('li_select');
$(this).addClass('li_select');
});