[英]pass value to modal popup using jquery by using data-id attribute in anchor tag
[英]toggling attribute value of anchor tag using jQuery
我有这个HTML。
<a href="#" class="button redB" style="margin: 4px 4px 4px -4px;" id="estEditItemToggleMode" data-mode="edit">
<img src="images/icons/light/check.png" alt="" class="icon">
<span>Enable Editing Mode</span>
</a>
点击我想继续切换class
属性和data-mode
的值,它应该像这样
if(mode == "edit") {
class = "button blueB";
data-mode = "select";
}
else if(mode == "select") {
class = "button redB";
data-mode = "edit";
}
我试过用这个。
$('#estEditItemToggleMode').live('click', function(e){
e.preventDefault();
if($(this).data('mode') == "edit") {
$(this).removeClass('redB').addClass('blueB');
$(this).attr('data-mode', 'select');
}
else if($(this).data('mode') == "select") {
$(this).removeClass('blueB').addClass('redB');
$(this).attr('data-mode', 'edit');
}
});
这只会将值切换一次。 因此对两次或多次点击没有影响。 如何正确地使用它。
试试如下,
$('#estEditItemToggleMode')
.data('mode', 'edit') //added data to the link
.live('click', function(e){
e.preventDefault();
var $this = $(this);
var mode = $this.data('mode');
if(mode == "edit") {
$this.removeClass('redB').addClass('blueB');
$this.data('mode', 'select'); //Changed from .attr to .data
}
else if(mode == "select") {
$this.removeClass('blueB').addClass('redB');
$this.data('mode', 'edit'); //Changed from .attr to .data
}
});
并从标记中删除attr data-mode
。
<a href="#" class="button redB" style="margin: 4px 4px 4px -4px;" id="estEditItemToggleMode" >
<img src="images/icons/light/check.png" alt="" class="icon">
<span>Enable Editing Mode</span>
</a>
编辑:缓存一些冗余的jQuery调用。
编辑2: .live
已弃用,因此您应该使用.on
或.delegate
编辑3:小提琴输出,
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.