JQuery 使用 title 和 src 属性

Question

我正在执行一个脚本，该脚本将通过单击复选框来获取输入的 src 属性，然后遍历所有其他复选框和单选按钮 .each 并删除任何输入（即 title 属性）的选中属性是'RQlevel' + this.src。希望这已经足够清楚了。

这是我的尝试，但它不正确。

function levels() {
   if ($(this).is(':not(:checked)').each(function()) {
        if($(':input').attr('title', 'RQlevel' + this.src) {
        $(':input').removeAttr('checked');
        });
   });    
} 

工作示例位于 http://jsfiddle.net/V8FeW/

Answer 1

我认为您对 this 的引用感到困惑。如果我正确理解您的问题，这应该可以满足您的要求：

function levels() {
  var $this = $(this); // Cache a reference to the element that was clicked
  if ($this.is(':not(:checked)') { // Determine if the clicked element is checked
    $(':input').each(function() { // Loop through every input element
      // Here, 'this' is the current element in the loop and
      // '$this' is the originally clicked element.
      if (this.title === ('RQLevel' + $this.attr('src'))) {
        $(this).removeAttr('checked');
      }
    });
  }
}

更新：

我应该早点意识到这一点，但您的主要问题是使用 src 属性作为基础你的比较。 src 属性被解析，以便当您查询它时，该值将是绝对 URL。也就是说，您将拥有值“http://example.com/2”，而不是值“2”。因此，您想使用 数据属性。请参阅我对 jsfiddle 的更新以获取工作示例。

另外，我没有使用 onclick 属性来注册事件处理程序，而是使用 jQuery 的 .bind() 方法。这是更新后的 JavaScript：

$(function() {
    $(':input').bind('click', function() {
        var src = $(this).data('src');

        if (!this.checked) {
            $('input:checked').each(function(){
                if (this.title === ('RQlevel' + src)) {
                    this.checked = false;
                }
            });
        }
    }); 
});

Answer 2

试试这个：

function levels() {
    if (!this.checked) {
        var src = this.src;
        $('input:checkbox, input:radio').each(function(){
            if (this.title === 'RQlevel' + src) {
                this.checked = false;
            }
        });
    }
}

请注意，应该这样调用：

$('#yourCheckbox').click(levels);

另请注意，这是检查元素的标题是否为 RQlevel 后跟原始的 src 值单击的元素。如果这不是您想要的，请将 each 调用中的 src 替换为 this.src 以检查 src > 当前元素的值。