从按钮列表中删除某些文本值

Question

我有一个按钮列表。当点击一个按钮时，它会将文本“selected”附加到按钮的现有值中。

当点击一个按钮时，如果文本存在，我想从其他按钮中删除“选择”的文本。

基本上应该是这样的 - 遍历该区域中的所有按钮（它们都有一个 searchResult 类）并从每个按钮中删除“selected”值（如果存在）。

这里是每个按钮的代码：

<input type="button" class="searchResult" onclick="$(\'#usersToSend > *\').css(\'background-color\', \'#fff\');
var oldValue = this.value;
this.value=\'(selected) \' + oldValue; this.style.backgroundColor = \'#51CA3E\';
document.getElementById(\'hiddenUserFlag\').value = \''.$row['id'].'\';"
value="'.$row['username'].'">

这里是需要注意的代码位：

$(\'#usersToSend > *\').css(\'background-color\', \'#fff\');
var oldValue = this.value;
this.value=\'(selected) \' + oldValue;
this.style.backgroundColor = \'#51CA3E\';

Answer 1

您可以使用:contains() 选择器和text() 方法，如下所示：

$("button").click(function(){
  $("button:contains('selected')").text(function(){
    return this.innerHTML.replace("selected","");
  })
  this.innerHTML+= "selected";
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button>button-</button>
<button>button-</button>
<button>button-</button>

更新：以上内容不适用于<input> 按钮。对于那些，使用.filter() 和.val() 方法如下：

$(":input").click(function(){
  $(":input").filter(function(){
    return this.value.indexOf("selected") > 0
  }).val(function(){
    return this.value.replace("selected","");
  })
  this.value+= "selected";
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="button" value="button-" />
<input type="button" value="button-" />
<input type="button" value="button-" />