如何從錨標籤獲取值並將其用於其他功能

Question

我有一個非常簡單的問題，但我無法弄清楚， 我是新手關於此。

我有一個以下功能，用戶將點擊他/她想要搜索的東西的按鈕，然後當他/她選擇並點擊選項周圍的某個東西時，他/她將點擊搜索按鈕進行搜索。

這是我從代碼中獲取錨定標記的值，這些選擇被包裹在錨定標記中。

$(document).on('click' , '#area_id_1' , function(){ 
var getText1 = $("#area_id_1").text(); 
alert(getText1); return false; }); 



$(document).on('click' , '#area_id_2' , function(){ 
var getText1 = $("#area_id_2").text(); 
alert(getText1); 
return false; 
}); 



$(document).on('click' , '#area_id_3' , function(){ 
var getText1 = $("#area_id_3").text(); 
alert(getText1); return false;}); 



$(document).on('click' , '#area_id_4' , function(){ 
var getText1 = $("#area_id_4").text(); 
alert(getText1); 
return false; 
}); 



$(document).on('click' , '#area_id_5' , function(){ 
var getText1 = $("#area_id_5").text(); 
alert(getText1); return false;}); 



$(document).on('click' , '#area_id_6' , function(){ 
var getText1 = $("#area_id_6").text(); 
alert(getText1); return false; }); 



$(document).on('click' , '#area_id_7' , function(){ 
var getText1 = $("#area_id_7").text(); 
alert(getText1); return false; }); 


$(document).on('click' , '#area_id_8' , function(){ 
var getText1 = $("#area_id_8").text(); 
alert(getText1); return false; }); 

，這裏是我的搜索按鈕功能 //鍵搜索功能

$(document).on('click', '#btnSearch', function() { 

}

的問題是，我怎麼能存儲，我得到的價值從錨標籤，所以我可以使用它，當我點擊btnSearch函數？

Answer 1

首先定義您的變量getText1 global如下。

var getText1; 

$(document).on('click' , '#area_id_1' , function(){ 
    getText1 = $(this).text(); 
    return false; 
}); 

...(rest of your code) 
// and you will get the variable in below function 

$(document).on('click', '#btnSearch', function() { 
    alert(getText1); // you can check here if it is empty or not 
} 

Answer 2

您需要使用全局變量或窗口變量..請參閱本 Click ..我會提到一些例子

<script> 
var yourGlobalVariable; // this is global variable 
function foo() { 
    // ... 
} 
</script> 


<script> 
function foo() { 
    window.yourGlobalVariable = ...; // this is window variable you can use 
} 
</script> 

Answer 3

首先，我不建議使用全局變量。 Global variable is bad practice

如果你不想使用全局變量。 您可以在btnSearch元素上設置值。 使用jQuery.fn.data函數，您可以使用特定的鍵字符串將值存儲到元素。 https://api.jquery.com/data/

而且您可以使用多個選擇器。將同一個事件處理函數附加到多個元素一次。 https://api.jquery.com/multiple-selector/

// You can use same handler function on multiple element once. 
// You don't have to declare same function each time. 
$('#area_id_1, #area_id_2, #area_id_3, #area_id_4' + 
', #area_id_5, #area_id_6, #area_id_7, #area_id_8').on('click', function() { 
    var text = $(this).text(); 
    // Set value at $('#btnSearch') with "text" key 
    $('#btnSearch').data("text", text); 
    alert(text); 
    return false; 
}); 

$(document).on('click', '#btnSearch', function() { 
    var text = $(this).data("text"); // You can get the value like this 
}