Question

我有以下HTML代码：

<?php foreach ($this->tags as $uri=>$tag){?>
    <input type="checkbox" name="tags[]" style="display: none;" value="<?php echo $uri;?>" id="create_<?php echo $uri;?>" <?php echo isset($args['tags']) && in_array($uri, $args['tags'])?'checked="checked"':'';?> />
    <span onclick="selectTag(this.id)" id="create_<?php echo $uri;?>" for="create_<?php echo $uri;?>" class="tag <?php echo isset($args['tags']) && in_array($uri, $args['tags'])?'selected':'';?>"><?php echo str_replace(' ', '&nbsp;', $tag);?></span>
<?php }?>

这是我的JS代码：

function selectTag(id) {
    var input = '.tags input#'+id;
    var span = '.tags span#'+id;
    if ($(input).is(':checked') && $(span).hasClass('selected')) {
        $(span).removeClass('selected');
        $(input).attr('checked', false);
    }
    else {
        $(span).addClass('selected');
        $(input).attr('checked', true);
    }
}

当我点击一个范围框时，选择该框，当我再次点击它时，它会取消选择它。问题是，在第3次之后，它就会停止工作。

我的代码无法正常工作有什么问题？

Answer 1

JQuery现在有一个prop方法，它比使用attr方法更好。

尝试通过调用attr("checked", true);

，使用prop("checked", true);替换您的来电

有关道具的文件，请参阅此处：http://api.jquery.com/prop/

这里有两者之间的讨论：.prop() vs .attr()

修改

此外，正如Ed Cottrell所述，您希望为您网页上的所有元素设置独特的ID属性。

<强> EDIT2：

我创建了一个演示此用法的小提琴：http://jsfiddle.net/xDaevax/E39hc/

Answer 2

您正在为input和span提供相同的id属性。每个元素的ID必须是唯一的;您不能拥有input和span相同的id。这样做会导致各种问题，包括您遇到的行为。给其中一个略有不同id（如create_<?php echo $uri;?>_span）。

另外，正如@xDaevax所说，你应该使用.prop而不是.attr - 我在使用.attr时遇到了同样的问题。

为什么在第三次点击后我的功能不起作用？

2 个答案: