jQuery var 不会保存

Question

我在页面中加载了 a href="tel:0400000000 值（它是 phone 数字的 php 回显）。我立即通过 jQuery 更改 href 以隐藏它 (href=tel:hidden)，希望当我运行一个特定的 action/function 我可以恢复到原来的。它位于 wordpress 插件中，因此格式为 jQuery.

我已经包含了 jQuery 函数的开头以协助任何响应。

已更新

原版HTML

<a class="button primary is-small expand" id="reunitePersonCall" href="tel:0400000000" ><span>Call Person</span></a>

jQuery

(function($){

    $(function() {
        
        $('#geoLocationButton').off().click(initiate_geolocation);
        
        $('#reunitePersonCall').data("saved", $('#reunitePersonCall').attr("href")).attr({
            "disabled":true,
            "href":"tel:hidden",
        }).prop("onclick", null);
        
        $('#reunitePersonNotify').attr("disabled", true);
        
        // Initiate Geolocation
        function initiate_geolocation() {

            navigator.geolocation.getCurrentPosition(showPosition,showErrors,{timeout: 5000});
            
        }

        // Output Geolocation
        function showPosition(position){

            var longitude = position.coords.longitude;
            var latitude = position.coords.latitude;
            
            $.ajax({
                url:    plugin_locate_person_obj.ajaxurl,
                type:   'POST',
                data:   { 
                        action: 'plugin_locate_person_request',
                        longitude: position.coords.longitude,   // $_POST['longitude'];
                        latitude: position.coords.latitude      // $_POST['latitude'];
                        },
                
                success: function(data) {
                    $('#geoLocationButton').html("Location Recorded").attr("disabled", true);
                    $('#geoLocationMap').html('<iframe src="https://maps.google.com/maps?q=' + latitude + ',' + longitude + '&z=17&output=embed" width="100%" height="170" frameborder="0" style="border:0"></iframe>');
                    $('#reunitePersonNotify').attr("disabled", false).off().click(reunite_person);
                    $('#reunitePersonCall').attr("disabled", false).off().attr("href", $('#reunitePersonCall').data("saved")).click(reunite_person);
                }
                
            });

        }

        // Geolocation Errors
        function showErrors(error) {

            switch(error.code) {

                case error.PERMISSION_DENIED: alert("Location Denied by User.");
                break;

                case error.POSITION_UNAVAILABLE: alert("Location Could Not be Detected.");
                break;

                case error.TIMEOUT: alert("Location Request Timed Out.");
                break;

                default: alert("Unknown Error.");
                break;

            }

        }
                
        function reunite_person() {
            
            var jsDate      = new Date();
            var finder_date = jsDate.toLocaleDateString("en-AU");
            var finder_time = jsDate.toLocaleTimeString("en-AU");
            
            $.ajax({
                url:    plugin_reunite_person_obj.ajaxurl,
                type:   'POST',
                data:   { 
                        action: 'plugin_reunite_person_request',
                        finder_name: $('input[name=finder_name]').val(),
                        finder_phone: $('input[name=finder_phone]').val(),
                        finder_date: finder_date,
                        finder_time: finder_time
                        },
                
                success: function(data) {
                    $("#reunitePersonNotify").prop("onclick", null).off("click");
                    $("#reunitePersonCall").prop("onclick", null).off("click");
                    $('#reunitePersonResults').html(data);
                    $('#geoPrivacy').hide();
                    
                }
            
            });
            
        }

    });

})(jQuery);

我想要实现的是原始的 html 一个 href 值（例如：电话：0400000000）被“保存”在 var 中，然后我可以对 href 属性做任何我想做的事情然后能够将其恢复为原始值（通过 var）。

页面加载时，由于 jquery，按钮 link 为 'tel:hidden'。但是当我单击附加到 geoLocationButton 的按钮时，与 reunitePersonCall 关联的按钮随后被激活（不再禁用）。当我想点击那个按钮时它是成功的，但是 $('#reunitePersonCall').attr("disabled", false).off().attr("href", $('#reunitePersonCall').data("saved")).click(reunite_person); 似乎也没有达到它的意思（这是将 a href 恢复到原来的 tel:0400000000 但它确实执行'reunite_person' 动作）。

Answer 1

看起来 Phone 变量在成功函数范围内不可见。您可以全局声明它，或者更好，只需将 phone 数字保存为 <a href> 标记的属性：

// Save href in data-saved before updating attribs:
$('#Call').data("saved", $("#Call").attr("href")).attr({
  "disabled":true,
  "href":"tel:hidden",
})

恢复：

success: function(data) {
  $('#Call').attr("disabled", false).off().attr("href", $('#Call').data("saved"));
}

Answer 2

我试过代码，它对我有用。

我能想到的两个选项是：

您正在使用 var 关键字，这会导致变量在该范围内是局部的，并且在 ajax success 调用中未知。
success 调用没有执行，是吗？

此外，永远不要相信 console.log() 函数关于变量的内容，因为它不是同步的

jQuery var 不会保存

jQuery var wont save

wordpress

jquery

var