獲取一個在css-selector上調用的插件內部元素的ID

我有一個基本問題。我有這樣的例子jQuery的插件，我想上具有一定的CSS選擇器的所有div運行（.myDiv）：獲取一個在css-selector上調用的插件內部元素的ID

(function($) { 
 

 
    $.fn.testt = function(options) { 
 
    console.log(this.id); 
 
    console.log($(this).attr('id')); 
 
    }; 
 

 
}(jQuery)); 
 

 

 
$(".myDiv").testt({ 
 
    'thickness': 3, 
 
    'color': '#ccc' 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="myDiv" id="myfirstDiv">blablabla</div>

我怎樣才能得到的div ID ？我的代碼總是返回我undefined。

來源

2017-07-31 css

'$（本）.attr（ 'ID'）'會的工作，'this'是在'testt的jQuery（）'不要混用它與DOM元素。你也可以使用'this.attr（'id'）' – Satpal

是的，一切都很好，你的第二個提醒。我得到身份證。 – curveball

嗨，..但是'$（this）.attr（'id'）'不起作用..上面的代碼給了我2倍undefined – css

this是一個jQuery對象，在testt()插件方法中，你可以使用各種jQuery方法來處理。

如果您有多個元素使用.each()和iterator方法

(function($) { 
 
    $.fn.testt = function(options) { 
 
    //Here this refers to jQuery object 
 
    this.each(function() { 
 
     //Here, this refers to underlying DOM element, so you can use various method 
 
     console.log(this.id); 
 
    })  
 
    }; 
 
}(jQuery)); 
 

 

 
$(".myDiv").testt({ 
 
    'thickness': 3, 
 
    'color': '#ccc' 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="myDiv" id="myfirstDiv">blablabla</div> 
 
<div class="myDiv" id="myfirstDiv2">blablabla</div> 
 
<div class="myDiv" id="myfirstDiv3">blablabla</div>

來源

2017-07-31 10:00:27 Satpal

使用此代碼：

這裏ID演示：https://output.jsbin.com/pasequp

HTML：

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width"> 
    <title>JS Bin</title> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
</head> 
<body> 
<div class="myDiv" id="myfirstDiv">blablabla</div> 
<div class="myDiv" id="myfirstDiv1">blablabla</div> 
<div class="myDiv" id="myfirstDiv2">blablabla</div> 
</body> 
</html>

的JavaScript：

(function ($) { 
    $.fn.testt = function(options) { 
    //Merge default and user parameters 
    options = $.extend({minlength: 0, maxlength: 99999}, options); 

    //traverse all nodes 
    this.each(function() { 
     var $this = $(this); 
      alert($this.attr('id')); 
      //alert(options.thickness); 
      //alert(options.color); 
     }); 
    }; 
}(jQuery)); 

$(".myDiv").testt({ 
    'thickness': 3, 
    'color': '#ccc' 
});

來源

2017-07-31 10:11:21

獲取一個在css-selector上調用的插件內部元素的ID

回答

相關問題