下劃線/刪除選擇元素中的所有選項

我們如何使用Jquery在選擇元素中下劃線/刪除所有選項。下劃線/刪除選擇元素中的所有選項

下劃線/刪除元素只顯示選定的選項作爲下劃線/刪除線。我需要將所有選項顯示爲下劃線/刪除線。

例子是如下：這樣表示如果我使用HTML代碼如下：

<select id="cmb1" style="width: 80px; float: left; position: absolute; top: 269px; left: 319px; cursor: pointer; text-decoration: line-through; font-family: Calibri;" data-combo="simple" data-div="divcmbSetting" class="ui-draggable ui-draggable-handle ui-selectee focused" data-lbl="lblcmb1" data-forecolor="51,51,51" data-backcolor="255,255,255" data-font="Calibri, 12px"><option value="Off" style="text-decoration: line-through;" class="ui-selectee">1</option><option value="Off" style="text-decoration: line-through;" class="ui-selectee">2</option><option value="Off" style="text-decoration: line-through;" class="ui-selectee">3</option><option value="Off" style="text-decoration: line-through;" class="ui-selectee">4</option></select>

enter image description here

，但它應該是這樣

enter image description here

我已經試過外觀低於Jquery，它將CSS應用於所有選項即使它在Source中也顯示，但不適用於Optio納秒。

JQUERY：

$("#cmb1 option").each(function() { 
         $(this).css("text-decoration", "line-through"); 
        });

DEMO

來源

2015-05-11 Jankya

這只是不適用於鍍鉻 – renakre

謝謝。我沒有在IE中檢查。無論如何，無論如何，它在Chrome中起作用嗎？ – Jankya

我無法找到一個可以「做直通」的例子，也許你可以禁用？ – renakre

不知道你可以原生樣式選擇菜單。但你可以用jquery-ui，它有一個可選的菜單。就像這樣：

添加跨度各地選項文本：

<select id="cmb1" style="width: 80px; float: left; position: absolute; top: 269px; left: 319px; cursor: pointer; text-decoration: line-through; font-family: Calibri;" data-combo="simple" data-div="divcmbSetting" class="ui-draggable ui-draggable-handle ui-selectee focused" data-lbl="lblcmb1" data-forecolor="51,51,51" data-backcolor="255,255,255" data-font="Calibri, 12px"> 
<option value="Off" style="text-decoration: line-through;" class="ui-selectee"><span>1</span></option><option value="Off" style="text-decoration: line-through;" class="ui-selectee"><span>2</span></option> 
<option value="Off" style="text-decoration: line-through;" class="ui-selectee"><span>3</span></option> 
<option value="Off" style="text-decoration: line-through;" class="ui-selectee"><span>4</span></option> 
</select>

添加選擇菜單：

$(document).ready(function(){ 
$('select').selectmenu(); 
})

設置CSS上跨度和li元素：

li, span 
{ 
    text-decoration: line-through; 

}

工作例如：http://jsfiddle.net/fy6gcvaz/

雖然您可能想要更改整個樣式的樣式。

來源

2015-05-11 04:07:05

下劃線/刪除選擇元素中的所有選項

回答

相關問題