jquery獲取動態新增的標籤物件

阿新 • • 發佈：2019-01-19

jquery無法直接給網頁裡面動態新增點選事件，並且獲取到物件
一般來說，js獲取動態新增的元件都是自定義給標籤新增上onclick屬性來達到呼叫，這是普通的方法，如下：

onclick方式獲取
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="test"></div>
</body> 

<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
<script>
    var html="";//宣告變數用於存放html
    for (i=0;i<=10;i++){
        html=html+"<button onclick='btnclick(this)'>按鈕"+i+"</button></br>";
    }
    $('#test').html(html);
    function btnclick(e) { 

        console.log(e.textContent);//獲取按鈕文字
    }
</script>
</html>

如今jquery已經到了3版本了，官方已經放棄live方式了，推薦使用on方法。語法為

$(‘選擇器’).on(‘click’,’選擇型別’,function (e){程式碼段}

jquery不能動態獲取到網頁裡面的標籤，需要先獲取到網頁固定的標籤，讓後再獲取裡面其他的標籤，所以，如上面程式碼中的id為test的div是固定不變的。

<!DOCTYPE html>
<html lang="en"> 

<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="test"></div>
</body>
<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
<script>
    var html="";//宣告變數用於存放html
    for (i=0;i<=10;i++){
        html=html+"<button>按鈕"+i+"</button></br>";
    }
    $('#test').html(html);
    $('#test').on('click','button',function (e){
        console.log($(this));
    });
</script>
</html>

這樣寫就非常簡單了，其中選擇型別裡面的button還可以進一步限制，如：button[class=test]，就是選擇動態建立的類為text的按鈕。
要實現單雙數只需要在test後面加”:even”,button[class=test]:even，或者odd偶數
下圖演示jquery動態獲取奇數物件
code演示

jquery獲取動態新增的標籤物件

jquery無法直接給網頁裡面動態新增點選事件，並且獲取到物件一般來說，js獲取動態新增的元件都是自定義給標籤新增上onclick屬性來達到呼叫，這是普通的方法，如下： onclick方式獲取 <!DOCTYPE html> <htm

jquery動態新增json物件引數

示例程式碼如下, 目的是判斷json array中的json object的title是否為廣東省，若是，則新增"selected": true $.getJSON("${pageContext.request.contextPath}/zone.acti

JQuery實現動態新增的標籤元素的點選事件

這裡所說的動態新增的元素的意思是：用js新增的標籤元素先說一下我遇到的問題：想對一些資料實現分頁，就自己寫一個分頁功能。用的是bootstrap的分頁，在頁面獲取資料列表後，計算出需要分多少頁展示，然後

jQuery獲取動態生成的元素

fun ast tails 生成 console ron sni 獲取 data 需求描寫敘述：頁面上能夠動態加入數據,比方table,點擊按鈕能夠動態加入行。又或頁面載入時table數據是通過ajax從後臺獲取的。而這時我們想要獲取當中的某個值,又該怎樣獲取呢？假設是

jQuery獲取動態表格中checkbox被選中一行的屬性數據

jquery table tr 表格動態 http://www.jianshu.com/p/0ec66caf4c40 jQuery獲取表格中checkbox被選中一行的屬性數據jQuery獲取動態表格中checkbox被選中一行的屬性數據

轉 jquery獲取兩個標籤之間文字

https://blog.csdn.net/u010403387/article/details/44197629?utm_source=blogxgwz8 如以下程式碼所示，id為tidy的<a>標籤中既存在<span>標籤，又存在“This is

jQuery實現動態新增tr到table的方法

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" <html> <head> <meta http-equiv="Content-Type" content="text/html;

利用js動態新增標籤，並且使用點選效果為其新增和移除class

js檔案 $(function () { $.ajax({ type: "post", url: purl+"/news/categorys", datatype: "json", succ

jquery獲取動態表中所有的單選框值

HTML程式碼，此處為動態生成的表： <table class="table table-striped table-bordered table-hover" id="testtable"> <thead align="center" styl

JS獲取點選標籤物件

<img src="img/main.png" class="mainpic hiden" id="mainpic" onload="showMax(this,500)"> <scr

Jquery實現動態新增table以及JSON陣列的解析

昨天寫一個作業的時候，因為一個錯誤浪費了我兩個多小時，為了以後不再同一個地方摔倒，果斷記錄下來。程式碼片先粘過來 $(".borrow").click(function(){ var text2=""; var text

jQuery 如何動態新增、刪除 class 樣式方法介紹

獲取與設定樣式獲取class和設定class都可以使用attr()方法來完成。例如使用attr()方法來獲取p元素的class，JQuery程式碼如下： var p_class = $("p").attr("class"); //獲取p元素的class [html]

jQuery為動態新增的新元素繫結點選事件

1.首先如何用jQuery動態新增a標籤： for (var index=0; index<5; index++){ var h = '<a>動態新增點選事件</a>

利用Easy UI生成非同步樹以及動態新增標籤頁

生成非同步樹 1.生成一個空樹，一般放在使用easyui佈局的west模組中<ul id="menuTree" class="easyui-tree">2.從伺服器獲取節點資訊，後端返回的

jquery 獲取動態input 的id

微信小程式實現動態新增標籤（1）

說明：最近入住微信小程式，將自己所學經歷分享出來，包括學到的知識，踩到的坑，一起分享給大家，後續會慢慢更新：首先針對一些幾乎沒有基礎的童鞋，附上一些連結，大致看完後能夠有能力製作簡單的小程式了：另外特別推薦一波福利（樣式庫，也就是說，各種

eazyUI動態新增標籤頁（tabs）

通過使用 jQuery EasyUI 可以很容易地新增 Tabs。您只需要呼叫 'add' 方法即可。在本教程中，我們將使用 iframe 動態地新增顯示在一個頁面上的 Tabs。當點選新增按鈕，一個新的 tab 將被新增。如果 tab 已經存在，它將被啟用。

jQuery實現動態新增刪除輸入框

在一個專案中，一個實體需要動態新增另外的實體多個，即在新增或者編輯這個實體的時候，需要動態新增輸入框。利用jQuery簡單實現了一下，小有成就感。 <%if(isAdd){%> <div class="am-g am-form-group am-mar

jquery html 動態新增元素繫結事件

由於實際的需要，有時需要往網頁中動態的插入HTML內容，並在插入的節點中繫結事件處理函式。我們知道，用Javascript向HTML文件中插入內容，有兩種方法，一種是在寫HTML程式碼寫入JS，然後插入到文件中；另外一種是通過ajax的方式，從伺服器獲取資料，然

jQuery-為動態新增的元素繫結事件(以及不重複新增新的內容)

在使用jQuery的方式為元素繫結事件時，我經常使用bind或者click,但這隻能為頁面已經載入好的元素繫結事件。像需要用ajax的方式請求遠端資料來動態新增頁面元素時，顯然以上幾種繫結事件的方式是無效的 $(selector).bind(event,d

jquery獲取動態新增的標籤物件

相關推薦