用Jquery打開特定類的對話框

我只是想簡化我的JQuery代碼。我有下面的代碼：用Jquery打開特定類的對話框

jQuery('.audioEnhancedHelp-opener').click(function() { 
    jQuery('.audioEnhancedHelp').dialog('open'); 
}); 
jQuery('.narrationHelp-opener').click(function() { 
    jQuery('.narrationHelp').dialog('open'); 
}); 
jQuery('.studentcodeHelp-opener').click(function() { 
    jQuery('.studentCodeHelp').dialog('open'); 
});

，並想用一個通用的標籤爲每個按鈕與特定的類類型的「*幫助大開眼界」，打開特定的對話框。這樣的事情：

jQuery('.LABELHelp-opener').click(function() { 
    jQuery('.LABELHelp').dialog('open'); 
});

我對jquery的知識很差，我找不到答案googling。有沒有辦法做到這一點？

由於提前，塞爾吉奧

來源

2013-07-01 user2538864

我覺得這符合你的基本要求：

jQuery('*[class *= "Help-opener"]').click(function() { 
     var cssClass = $(this).attr("class"); 
     var helper = cssClass.substring(0, cssClass.length-11); 
     jQuery('.' + helper + 'Help').dialog('open'); 
    });

注意，這將不處理，如果有多個類對你點擊元素的情況。您可能需要考慮具有特定於此類型按鈕的CSS類，然後將該對話框存儲在另一個屬性中（例如'data-dialog'）;這使代碼顯着簡化。

來源

2013-07-01 11:59:02

看看the selectors you can use。特別是contains。

所以基本上找到所有具有「幫助開啓者」作爲一個類的元素。然後，您需要使用「 - 」作爲分隔符將類「studentcodeHelp-opener」分解。然後你可以獲取「studentcodeHelp」的名字。

但是，我建議把目標放在另一個屬性，例如data-target這將緩解解析位。例如：

<div class="Help-opener studentcodeHelp-opener" data-target="studentcodeHelp"> [... ] </div> 
<div class="Help-opener narrationHelp-opener" data-target="narrationHelp"> [... ] </div>

然後是JS爲那一個：

$(function() { 
    $('div.Help-opener').click(function() { 
    $('.' + $(this).attr('data-target')).dialog('open') 
    } 
});

來源

2013-07-01 12:02:57 Eric

用Jquery打開特定類的對話框

回答

相關問題