茄子在线看片免费人成视频,午夜福利精品a在线观看,国产高清自产拍在线观看,久久综合久久狠狠综合

    <s id="ddbnn"></s>
  • <sub id="ddbnn"><ol id="ddbnn"></ol></sub>

  • <legend id="ddbnn"></legend><s id="ddbnn"></s>

    用DIV遮罩解決鼠標直接勾選checkbox無效的問題
    來源:易賢網 閱讀:1429 次 日期:2014-09-23 10:28:35
    溫馨提示:易賢網小編為您整理了“用DIV遮罩解決鼠標直接勾選checkbox無效的問題”,方便廣大網友查閱!

    在前端開發(fā)的過程中,遇到一種情況,需要勾選,為了用戶的操作便捷就將click事件放到了DIV上。(其中使用了knockout.js)

    代碼大概如下:

    代碼如下:

    <div id="one" data-biind="click:clickevent">

    <input type="checkbox"><span>有事請勾我</span>

    </div>

    但是這樣寫出現(xiàn)了一個奇怪的現(xiàn)象,鼠標點擊div一切正常。

    但鼠標直接勾選checkbox不正常:

    checkbox處于未勾選狀態(tài),鼠標直接點擊checkbox勾選,此時應該實現(xiàn)是:1、執(zhí)行div的clickevent事件;2、事件執(zhí)行完畢后,checkbox處于勾選狀態(tài)。

    但最終的結果卻是,checkbox仍然處于未勾選狀態(tài)。

    跟蹤調試結果是,在執(zhí)行完clickevent事件時,checkbox還是處于勾選狀態(tài),但clickevent執(zhí)行完后,接著進入jquery的代碼執(zhí)行,走了兩三步后,checkbox即被改成未選中狀態(tài)。

    原因至今未查到。(另外一個地方使用的radiobox也有類似的情況)

    沒辦法,只能變通一下,通過在checkbox上面覆蓋一層div,讓鼠標點擊的時候點的是div而不是checkbox,通過clickevent改變checkbox狀態(tài)(clickevent事件中本來就有改變checkbox狀態(tài)的代碼)

    實現(xiàn)如下:

    代碼如下:

    <div id="one">

    <div id="two" data-bind="click:clickevent"></div>

    <div id="three">

    <input type="checkbox"/> <span>有事請勾我</span>

    </div>

    </div>

    ID為two和three的兩個div,設置時關鍵是需要設置兩個屬性:position:absolute; z-index:1;

    其中上面那層的div的z-index屬性要比在下面那層的div大。

    以上DIV的ID屬性只是為了說明,一般程序中使用class屬性設置。

    更多信息請查看IT技術專欄

    更多信息請查看網頁制作

    2026國考·省考課程試聽報名

    • 報班類型
    • 姓名
    • 手機號
    • 驗證碼
    關于我們 | 聯(lián)系我們 | 人才招聘 | 網站聲明 | 網站幫助 | 非正式的簡要咨詢 | 簡要咨詢須知 | 新媒體/短視頻平臺 | 手機站點 | 投訴建議
    工業(yè)和信息化部備案號:滇ICP備2023014141號-1 云南省教育廳備案號:云教ICP備0901021 滇公網安備53010202001879號 人力資源服務許可證:(云)人服證字(2023)第0102001523號
    聯(lián)系電話:0871-65099533/13759567129 獲取招聘考試信息及咨詢關注公眾號:hfpxwx
    咨詢QQ:1093837350(9:00—18:00)版權所有:易賢網