jquery獲取并修改觸發(fā)事件的DOM元素示例【基于target 屬性】
更新時間：2019年10月10日 11:28:31 作者：flysnownet
這篇文章主要介紹了jquery獲取并修改觸發(fā)事件的DOM元素,結(jié)合實例形式分析了jQuery基于target 屬性獲取到觸發(fā)該事件的dom并修改的相關(guān)操作技巧,需要的朋友可以參考下
本文實例講述了jquery獲取并修改觸發(fā)事件的DOM元素。分享給大家供大家參考，具體如下：
需求
當(dāng)點擊關(guān)注后，改變按鈕樣式并顯示取消關(guān)注，如圖
實現(xiàn)
利用jQuery的 target獲取到觸發(fā)該事件的dom,然后修改它
target 屬性
代碼：
HTML
<div class="people-desc">
<div class="people-name">{$vo['nickname']}</div>
<div class="people-state" οnclick="toFollow({$vo['follow_user_id']})">+關(guān)注</div>
</div>
function toFollow(follow_user_id) {
console.log(event);
var toUrl = "{:url('index/follow/toFollow')}";
var postData = {follow_user_id:follow_user_id};
$.post(
toUrl,
postData,
function (result) {
if(result.code == 0){
target.outerHTML = "<div class=\"people-state active\" οnclick=\"toFollow("+follow_user_id+")\">取消關(guān)注</div>";
}else{
//失敗
layer.msg(result.msg);
}
},"JSON");
}
更多關(guān)于jQuery相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《jQuery常見事件用法與技巧總結(jié)》、《jQuery常用插件及用法總結(jié)》、《jQuery操作json數(shù)據(jù)技巧匯總》、《jQuery擴展技巧總結(jié)》、《jQuery常見經(jīng)典特效匯總》及《jquery選擇器用法總結(jié)》
希望本文所述對大家jQuery程序設(shè)計有所幫助。
相關(guān)文章
jQuery學(xué)習(xí)總結(jié)之jQuery事件
今天總結(jié)一下jQuery事件，這是比較重要的一塊，希望本次總結(jié)能幫助到很多同我一樣的新手2014-06-06
這篇文章主要介紹了jQuery查找節(jié)點方法,結(jié)合完整實例形式分析了jQuery針對DOM節(jié)點屬性的相關(guān)操作技巧,需要的朋友可以參考下2016-09-09
這篇文章主要介紹了jQuery實現(xiàn)點擊滾動到指定元素上的方法,結(jié)合實例形式分析了jQuery響應(yīng)鼠標(biāo)事件動態(tài)操作頁面元素屬性的相關(guān)相關(guān)使用技巧,需要的朋友可以參考下2020-03-03
瀏覽器端跨域訪問一直是個問題, 多數(shù)研發(fā)人員對待js的態(tài)度都是好了傷疤忘了疼,所以病發(fā)的時候,時不時地都要疼上一疼.記得很久以前使用iframe 加script domain 聲明,yahoo js util 的方式解決二級域名跨域訪問的問題.2009-12-12
這篇文章主要介紹了jQuery基于擴展簡單實現(xiàn)倒計時功能的方法,涉及jQuery擴展與回調(diào)函數(shù)的相關(guān)使用技巧,需要的朋友可以參考下2016-05-05
jQuery實現(xiàn)統(tǒng)計復(fù)選框選中數(shù)量
這里給大家分享一段jQuery實現(xiàn)的統(tǒng)計復(fù)選框選中數(shù)量的代碼，非常的實用，有需要的小伙伴們請帶走！2014-11-11
jquery的attr方法禁用表單元素禁用輸入內(nèi)容
這篇文章主要介紹了通過jquery的attr方法來禁用表單元素禁輸入內(nèi)容，示例如下，需要的朋友可以參考參考2014-06-06
好幾年不寫JS了，資料整理起來比較慢，格式也有點亂2010-07-07
國外著名博客WDL發(fā)布了2011年度最佳 jQuery 插件。jQuery 自2006年發(fā)布以來，經(jīng)過五年的迅速發(fā)展，目前已是最流行和使用最廣泛的 JavaScript 框架2012-03-03
JQuery和HTML5 Canvas實現(xiàn)彈幕效果
這篇文章主要介紹了JQuery和HTML5 Canvas兩種方法實現(xiàn)彈幕效果，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-01-01