2013-09-27 43 views
3

我的SharePoint網站中有以下標籤菜單。我已經申請了以下腳本來顯示周圍的標籤藍色邊框: -如何在單擊菜單時保留邊框顏色

$(document).ready(function(){ 

$("span:contains('Page Options')").css('border-top', '4px solid #008CD2'); 
$("span:contains('Page Options')").css('border-left', '1px solid #008CD2'); 

$("span:contains('Page Options')").css('border-right', '1px solid #008CD2'); 

}); 

這將如下很好地工作: -

enter image description here

但當選項卡上的用戶點擊邊框會如下清理出去: -

enter image description here

任何人都可以建議我怎麼能保持邊境所示雷加無論該標籤是否被點擊或不是? 感謝

+0

嘗試使用'!important' – Greenhorn

回答

0

嗨,你可以嘗試這樣...更新ANSWER

http://jsfiddle.net/kasperfish/wfvnQ/

第一類添加到您的CSS。我們需要一個單獨的類,因爲jquery無法正確處理「!important」,並且它使一切變得更容易。

.blue_border{ 
border-top: 4px solid #008CD2 !important; 
border-right: 4px solid #008CD2 !important; 
border-left: 4px solid #008CD2 !important; 
} 

然後在你的JS你可以做。

$(document).ready(function(){ 

    $("span:contains('Page Options')").addClass('blue_border'); 

}); 
+0

這將不起作用,即使用戶沒有單擊該標籤時。 –

+0

更新了我的答案。選擇器有問題。還包括一個jsfiddle –

1

把下面提到的css類放在style標籤中。

.tabBorder{ 
    border-top:4px solid #008CD2; 
    border-right:1px solid #008CD2; 
    border-left:1px solid #008CD2; 
} 

然後將以下代碼添加到腳本標記中。

$(function(){ 
    $("span:contains('Page Options')").addClass("tabBorder"); 
}); 

這是不清除邊界,除非或直到你重新加載,刷新或執行下面的腳本。

$("span:contains('Page Options')").removeClass("tabBorder"); 

但請確保上面的代碼將刪除包含頁面選項的所有span標記邊界。所以你需要跟蹤那個特定的跨度,否則你想刪除那個類。

請看看下面的網址

http://jsfiddle.net/shailesh_rathod19/jVpxb/

我沒有發現任何問題。在這。 讓我知道進一步的幫助! 謝謝。

+0

感謝您的答覆,仍然當我點擊「頁面選項」選項卡上,藍色寄宿生將被刪除?任何關於什麼可能造成這種情況的想法? –