jquery和創建樣式，如何檢查樣式是否已經存在

嗨，我環顧四周，但似乎無法找到我正在尋找答案的人。jquery和創建樣式，如何檢查樣式是否已經存在

我有一個搜索頁面，它會調用ajax，返回json數據，然後根據返回的數據創建一個樣式，並將其附加到DOM的部分。樣式的創建工作正常，但是如果進行新的搜索，樣式會被重複，所以我的$（＃element）.slidetoggle（）函數會被重複，並且滑動條會立即打開並關閉。

YPU可以在這裏看到的頁面：http://www.reelfilmlocations.co.uk/NEW%20Search/fullsearch_jq_keys.php

（用作測試數據豪恩斯洛，北倫敦和類別：墓地）如果相同的搜索是由兩次結果的樣式被複制，並且滑切換行爲是重複的。）

我的問題是我如何檢查樣式是否已經存在。

創建風格的腳本如下：

function makeCSS(id){ 
     var myUrl = 'getBoroughInfo.php'; 
     $.ajax({ 
      url: myUrl, 
      type: 'POST', 
      data: 'myID='+id, 
      dataType: 'json', 
      error: function(xhr, statusText, errorThrown){ 
       // Work out what the error was and display the appropriate message 
      }, 
      success: function(myData){ 
       var items = myData.boroughs[0]; 
       //console.log('borough: '+myData.boroughs); 

       $("<style type='text/css'> #link_"+items.Borough_ID+"{ color:"+items.color+"; font-weight:bold; float:left; margin-left: 10px; cursor: pointer; padding: 1px; border: 1px solid "+items.color+";} </style>").appendTo("head"); 
       $("<style type='text/css'> #borough_"+items.Borough_ID+"{ color:"+items.color+"; font-weight:bold; } </style>").appendTo("head"); 
       $("<style type='text/css'> #searchHead_"+items.Borough_ID+"{ color:#000000; font-weight:bold; background-color:"+items.color+"; opacity: 1.0; cursor: pointer;} </style>").appendTo("head"); 
       //apply opacity 
       //$('#borough_'+items.Borough_ID).css({}); 
       $('#borough_links').append('<div id="link_'+items.Borough_ID+'">'+items.Borough_Name+'</div>'); 
       $('#results').append('<div id="searchHead_'+items.Borough_ID+'">'+items.Borough_Name+'</div>'); 
       $('#results').append('<div id="borough_'+items.Borough_ID+'"></div>'); 
       $('#link_'+items.Borough_ID).live('click', function(){ 
        $('#borough_'+items.Borough_ID).slideToggle('slow', function() { 
         // Animation complete. 
        }); 
       }); 
       $('#searchHead_'+items.Borough_ID).live('click', function(){ 
        $('#borough_'+items.Borough_ID).slideToggle('slow', function() { 
         // Animation complete. 
        }); 
       }); 
      } 
     }); 
    };

這是代碼，創建了我的風格之一行：

$("<style type='text/css'> #link_"+items.Borough_ID+"{ color:"+items.color+"; font-weight:bold; float:left; margin-left: 10px; cursor: pointer; padding: 1px; border: 1px solid "+items.color+";} </style>").appendTo("head");

那麼，如何檢查，如果這個存在於該文件已經？一個簡單的if語句就足以滿足我的需求。

來源

2011-02-17 Dizzy Bryan High

給樣式標籤一個ID並檢查具有此ID的元素是否存在。但是，爲什麼要動態添加樣式？如果您可以控制HTML，爲什麼不直接添加樣式？ – 2011-02-17 17:39:07

此外，對於每個請求，「items.Borough_ID」總是不同的？如果不是，那**是你的問題。 – 2011-02-17 17:45:56

您可以使用：包含選擇器。例如：

if($("style:contains('#link_" + items.Borough_ID + "')").length < 1) 
{ 
    $("<style type='text/css'> #link_"+items.Borough_ID+"{ color:"+items.color+"; font-weight:bold; float:left; margin-left: 10px; cursor: pointer; padding: 1px; border: 1px solid "+items.color+";} </style>").appendTo("head"); 
}

來源

2011-02-17 17:40:27 Chandu

jquery和創建樣式，如何檢查樣式是否已經存在

回答

相關問題