在select标签中使用jQuery（）。trim（）？

Question

HTML

<select name="tree">
<option>All</option>
    <option id="sel_cat" value="1"> &nbsp Activity</option>
    <option id="sel_cat" value="2"> &nbsp Alert</option>
    <option id="sel_cat" value="3"> &nbsp &nbsp Lead</option>
    <option id="sel_cat" value="4"> &nbsp &nbsp &nbsp Notification</option>
</select>

的JavaScript

$('#sel_cat').change(function(){
      // do some
});

我可以在视图选择中修剪空格，但是当单击选择空格时仍然可以。

更新

Answer 1

更好的方法：

$("#sel_cat > option").each(function () {
    this.innerHTML = this.innerHTML.replace(/ /g, '');
});

JSFiddle

仅供参考： id 应该是唯一的

根据您的意见，

$("#sel_cat").on('change', function () {
 $( "#sel_cat option:selected" ).html($( "#sel_cat option:selected" ).html().replace(/ /g, ''))
});

<强> JSFiddle2

Answer 2

首先，您对多个元素使用相同的ID。别。使用类或其他选择器 - 我认为您希望定位选择而不是选项。此外，它不是&nbsp - 它是 。此外，您的代码永远不会调用trim()，所以我猜问题不在于修剪，而在于选择器。你看到改变事件了吗？

<select name="tree" id="mySelect">
    <option>All</option>
    <option class="sel_cat" value="1"> &nbsp; Activity</option>
    <option class="sel_cat" value="2"> &nbsp; Alert</option>
    <option class="sel_cat" value="3"> &nbsp; &nbsp Lead</option>
    <option class="sel_cat" value="4"> &nbsp; &nbsp; &nbsp; Notification</option>
</select>

$('#mySelect').change(function(){
    alert($.trim($(this).val()));
});

那应该做我认为你想要的。有关实例，请参阅http://jsfiddle.net/LAWDU/

Answer 3

如果你想从字符串中修剪空格（这是我从你的问题中读到的）你可以用这段代码扩展String对象

if (!String.prototype.trim) {
 String.prototype.trim = function() {
  return this.replace(/^\s+|\s+$/g,'');
 }
}

并用它来修剪像这样的空格

str.trim();

如果您还需要修剪不可破坏的空格 ，则必须添加以下内容

.replace(/ /g,'');

Answer 4

<select name="tree" id="sel_cat">
<option>All</option>
    <option value="1"> &nbsp; Activity</option>
    <option value="2"> &nbsp; Alert</option>
    <option value="3"> &nbsp; &nbsp; Lead</option>
    <option value="4"> &nbsp; &nbsp; &nbsp; Notification</option>
</select>

JS：

$('#sel_cat').change(function(){
    //your code
    $.trim($(this).html());
    //your code
});

Answer 5

使用以下代码：

$('#mySelect').change(function(){
     alert($.trim($(this)[0].options[$(this)[0].selectedIndex].text));
});  

HTML：

<select name="tree" id="mySelect">
    <option>All</option>
    <option value="1"> &nbsp Activity</option>
    <option value="2"> &nbsp Alert</option>
    <option value="3"> &nbsp &nbsp Lead</option>
    <option value="4"> &nbsp &nbsp &nbsp Notification</option>
</select>