我试图删除选择选项中的文本，但由于某种原因它不起作用。
Fiddler: https://jsfiddle.net/99x50s2s/95/ https://jsfiddle.net/99x50s2s/95/
HTML:
<select>
<option value="1" class="strikeout text-style">Some Text 1</option>
<option value="2" disabled="true">Some Text 2</option>
<option value="3" class="strikeout text-style">Some Text 3</option>
</select>
CSS:
.strikeout {text-decoration:line-through;}
.text-style {color:blue;}
颜色被应用，但文本装饰未被应用。我错过了什么吗？任何建议表示赞赏。
期待：
选项“Some Text 1”和“Some Text 3”应被删除。
这将需要更多的代码行和工作量，您还需要使用 JQuery 和 bootstrap。
$('body').on('click', '.option li', function () {
var i = $(this).parents('.select').attr('id');
var v = $(this).children().text();
var o = $(this).attr('id');
$('#' + i + ' .selected').attr('id', o);
$('#' + i + ' .selected').text(v);
});
$(".disabledM").click(function(event) {
event.preventDefault();
});
body {
margin:20px;
}
.select button {
width:100%;
text-align:left;
}
.select .sel {
position:absolute;
right:10px;
margin-top:10px;
}
.select:last-child>.btn {
border-top-left-radius:5px;
border-bottom-left-radius:5px;
}
.selected {
padding-right:10px;
text-decoration: line-through;
}
.option {
width:100%;
}
a.disabled-link,
a.disabled-link:visited ,
a.disabled-link:active,
a.disabled:hover {
background-color:#d9d9d9 !important;
color:#aaa !important;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>
<div class="input-group-btn select" id="select1">
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-expanded="true"><span class="selected"></span> <span class="sel"></span>
</button>
<ul class="dropdown-menu option" role="menu">
<li><s>Some Text 1</s>
</li>
<li class="disabledM">Some Text 2</li>
<li><s>Some Text 3</s>
</li>
</ul>
</div>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
