1. 程式人生 > >頁面有多個相同的id或者class時,繫結jquery事件無效,解決方案

頁面有多個相同的id或者class時,繫結jquery事件無效,解決方案

<div id="cp_liuyan" class="cp_tl cp_tl2" >按鈕</div>
<div id="cp_liuyan" class="cp_tl cp_tl2" >按鈕</div>
<div id="cp_liuyan" class="cp_tl cp_tl2" >按鈕</div>
<div id="cp_liuyan" class="cp_tl cp_tl2" >按鈕</div>

假設場景:頁面多個按鈕呼叫同一個jquery方法,如上面程式碼

jquery程式碼

	$("#cp_liuyan").click(function(){
	});

按照以往的寫法,我們這樣寫是感覺不會出錯的!

但是,測試發現:只有點選第一個按鈕才會觸發jquery方法,點選其他按鈕無效;

殘酷的事實告訴我們,那種寫法是錯的!

jquery程式碼,正確寫法

	$("div#cp_liuyan").click(function(){});
應該帶上字首div,不然,只有點選第一個按鈕才會觸發jquery方法!

相關推薦

頁面相同id或者classjquery事件無效解決方案

<div id="cp_liuyan" class="cp_tl cp_tl2" >按鈕</div> <div id="cp_liuyan" class="cp_tl cp_tl2" >按鈕</div> <div id="

一個頁面script標籤執行順序

JavaScript直譯器在執行指令碼時,是按塊執行的。通俗地說,就是瀏覽器在解析HTML文件流時,如果遇到一個script標籤,則JavaScript直譯器會等到這個程式碼塊都載入完成後,先對程式碼塊進行預編譯,然後再執行。執行完畢後,瀏覽器會繼續解析下面的HTML文件流,同時JavaSc

一個表單中相同的欄位,以及springmvc接收相同物件問題

                                      &

關於審批成功或確認逆向操作下相同動作的程式設計

我們在開發過程中,一般都會遇到這樣的需求吧。審批通過的時候要執行多個動作: 1.更改A表的狀態為“已審批”,我們記為操作A 2.插入B表一條資料 ,我們記為操作B 3.更改C表的多條資料的狀態,我們記為操作C N多 ....... 但是當N多天後,在業務發生需要逆向這個審批的時候,我們需要回滾這些操作。 我們

html滾動條使用以及頁面div塊如何讓body頁面不使用滾動條只在某個div內使用滾動條

滾動條基本知識: 建議比價華麗的頁面使用overflow:scroll這個樣式的滾動條,比較好看。 scrollbar屬性、樣式詳解 1. overflow內容溢位時的設定(設定被設定物件是否顯示滾動條) overflow-x水平方向內容溢位時的設定 ov

關於videoJs遇到的坑(一個頁面視訊需要載入)

涉及到課程的視訊:有多節課選擇 廢話不多說直接上程式碼: var videoPlayer = $("#my-video").get(0); if (typeof (videoPlayer) != "undefined") { var myPlayer = vi

頁面獲取相同name的input文字框的值的方法

第一種用each遍歷 $("input[name='productNames']").each(function(){ if( $(this).val().trim() == '') {  laye

elementui 一個頁面upload元件 共用方法怎麼傳自己的引數

https://www.cnblogs.com/steamed-twisted-roll/p/9473644.html &nbs

Python爬蟲:在帶有屬性值的class選擇器中選擇其中一個值實現標籤快速精準定位

在寫爬蟲時,定位標籤位置獲取想要的資料是匹配工作的重點。通過class或id選擇器的值(屬性值要求在網頁中是唯一的)可以很快的實現標籤的定位。 <span data-post-id="114214" class=" btn-bluet-bigger href-styl

微擎平臺、域名共用一個公眾號Oauth回撥域名終極解決方案

通宵搞了一晚,終於把這個問題解決了! 需求是這樣的 現在有3個不同的域名,一個認證的微信公眾號,由於公眾號授權回撥頁面域名只能寫一個,因此對於我有多個微擎系統分別部署在不同伺服器上(一臺做營銷業務、一臺做分銷系統、一臺做餐飲系統),分別部署的原因是主要是兩點:分流和防止一個域名被封(主要是微信營

mybatis的對映檔案當入參Map應注意還有入參用@Param註解出現失敗

<select id="findPostsBetweenRange" parameterType="java.util.Map" resultMap="PostResultMap"> SELECT p.id as post_id,

js後加載頁面元素時間都無法用解決方法

問題如下,頁面的table元素動態新增,當對table中的input做限制的時候無法操作,先看程式碼: $("#defaultView_content input").attr("disabled","disabled"); 然後噁心的我抓狂,後來通過谷歌搜了一波,果然: $('#defa

mysql和mariadb中字段拼接類型字段或者一個字段和一個固定字符串拼接

str1 from 連接 字符串連接 一個 cat str 拼接 str2 MySQL中concat函數 CONCAT(str1,str2,…) 1 .兩個或多個字段連接 例:字段 a,b 表 tb1 語句: select conca

jQuery遍歷相同class點選顯示隱藏圖示顯示及隱藏其下的內容

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=

jsp 頁面id 到java後臺的處理方式

java 開發中經常遇到 jsp 頁面傳多個id 到後臺處理的情況。比如:批量刪除選擇內容等....... 我使用的解決的方法兩種: jsp 傳多個id:使用easyui datagrid 選擇多行方式 var rows = $("#classids").datagrid('getSel

1、Jquery form表單ajax提交 2、jquery.filter校驗相同型別的文字框是否輸入資料重複

JSP引用該JS <script type="text/javascript" src="http://malsup.github.com/jquery.form.js"></script> 表單儲存按鈕 onclick=save(); func

當一個標籤裡面class屬性的時候如何判斷是否哪個屬性

如圖,選中的那一行<button>標籤,裡面的class值,有兩個,一個是startTime還有一個是chooseButton,我需要判斷是否含有chooseButton這個class,再進行相應的操作,當只有一個一個class的時候,我們可以通過$(this).attr('cla

docker刪除相同IMAGE ID映象的檔案

  當我們指定版本和最新版本相同的時候,可能會有相同的IMAGE ID。 當我們指定IMAGE ID進行刪除時,因為IMAGE ID的映象存在多個,所以會存在提示: Error response from daemon: conflict: unable to del

如果一個父類個子類或者一個介面實現的時候Spring是如何判斷該呼叫哪個的呢?原始碼分析如下

在doResolveDependency的裡面進行呼叫determinePrimaryCandidate(matchingBeans, descriptor);方法判斷 determinePrimaryCandidate(matchingBeans, descr

JS 獲取相同class的html內容

<div> <p class="molecule">30</p> <p class="Denominator">7.5%&