JQuery / Ajax - Нажмите, чтобы раскрыть

Question

Я хочу создать ссылку, которая говорит:

<a href="#" id="reveal" alt="928">Click here to show contact information</a>

При щелчке по нему он пропингует скрипт через ajax-запрос, ajax-запрос ищет таблицу пользователя, в которой содержится идентификатор, содержащийся в теге alt, возвращает определенное поле из базы данных, а затем div изменится с этой ссылки на контактный номер.

Я уверен, что некоторые из вас уже видели это, например:

Нажмите, чтобы увидеть телефон человека

Они нажимают на нее, и она меняется на их номер телефона.

Как бы я поступил так? Я хочу сделать это, используя ajax вместо того, чтобы указывать номер телефона в исходном коде, потому что это на самом деле сводит на нет цель их нажатия, чтобы узнать, могут ли боты получить его из исходного кода.

Спасибо:)

Answer 1

Somethign в соответствии с

$("#reveal").click(function(){

$.get('getphoneNumber.php',{id:$(this).attr('alt')}, function(data) {

    $('#reveal').html(data);

   });
});

с помощью php-скрипта getphoneNumber.php, который принимает параметр get id

Answer 2

$("#reveal").live('click',function(event) {
var link = $(this).attr('alt');
var dataString = 'alt=' + link ;

    $.ajax({
            type: "POST",
            url: "url",
            cache:false,
            data: dataString,

            success: function(data){

                this.href = this.href.replace(data);




            }

        });

}

Answer 3

Попробуйте это

$('#reveal').click(function () {
    var th = $(this);
    $.get('/get-the-phone-number', { id: th.attr('alt') }, function (response) {
        th.text(response);
    });
});

Кроме того, я бы порекомендовал поместить число id в атрибут data-contact-id и получить к нему доступ через th.data('contact-id') вместо использования атрибута alt. Не обращайте на меня внимания, если у вас есть другие причины сделать это.

Answer 4

<a href="#" id="reveal" alt="928">Click here to show contact information</a>
<div id="myHiddenDiv"></div>

$("#reveal").click(function(){
   $.get("test.php", { id: $(this).attr("alt") },
     function(data){
         $("#myHiddenDiv").html(data);
         $("#myHiddenDiv").show();
     });
});

Этот пример работает при условии, что у вас есть только один из этих «плагинов» на вашем сайте, если у вас их несколько, используйте:

<a href="#" class="reveal" alt="928">Click here to show contact information</a>
<div class="myHiddenDiv"></div>

$(".reveal").click(function(){
   var divSelector = $(this).next("div");
   $.get("test.php", { id: $(this).attr("alt") },
     function(data){
         divSelector.html(data);
         divSelector.show();
     });
});