通過jQuery中的其他功能訪問DOM元素

Question

我有一個button

<button type="button" data-id="5" class="get_attr" >Click Me</button>

我想獲取數據ID值，然后編寫代碼

<script type="text/javascript">
    $(".get_attr").on("click",function(){
        var id = $(this).data("id");
        console.log("id = "+id);  //id = 5
    });
</script>

假設我想要這個值，或者如果我從這樣的代碼中調用function ，並且想要這樣，則從另一個function對該button執行任何功能：

<script type="text/javascript">
    $(".get_attr").on("click",function(){
        updateValue(this);
    });

    function updateValue(this){ // it will take it as a parameter
        var id = $(this).data("id");
        console.log("id = "+id);  //id = 5
    }
</script>

Answer 1

您不能使用“ this”，因為它是Javascript關鍵字

<script type="text/javascript">
$(".get_attr").on("click",function(){
    updateValue(this);
});

function updateValue(abc){ // it will take it as a parameter
    var id = $(abc).data("id");
    console.log("id = "+id);  //id = 5
}

現在工作正常...

Answer 2

作為this是一個保留字，參數名稱從更改this像其他一些updateValue(thatObj)

 $(".get_attr").on("click",function(){ updateValue(this); }); function updateValue(thatObj){ var id = $(thatObj).data("id"); console.log("id = "+id); } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <button type="button" data-id="5" class="get_attr" >Click Me</button> 

Answer 3

您不能在函數定義中使用保留關鍵字。 它只需在定義中使用另一個名稱即可使用。

<script type="text/javascript">
        $(".get_attr").on("click",function(){
            updateValue(this);
        });

        function updateValue(originalObject){ // it will take it as a parameter
            var id = $(this).data("id");
            console.log("id = "+id);  //id = 5
        }
    </script>

Answer 4

嘗試這個

  $(".get_attr").on("click",function(){ var id = $(this).data("id"); console.log("id = "+id); //id = 5 }); $(".get_attr").on("click",function(){ updateValue(this); }); function updateValue(x){ // it will take it as a parameter var id = $(x).data("id"); console.log("id = "+id); //id = 5 } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <button type="button" data-id="5" class="get_attr" >Click Me</button>