使用正確的信息替換隱藏的文本點擊

我正在創建一個在線簡歷，並希望隱藏部分個人詳細信息，直到用戶單擊一個按鈕以顯示它。我希望這將防止垃圾郵件發送者能夠輕鬆獲取我的個人信息。使用正確的信息替換隱藏的文本點擊

的概念基本上是什麼gumtree.com.au做，它可以低於澳大利亞以外的人的圖像中可以看出：

Gumtree

我的頁面的HTML是：

<div class="personal"> 
    <p>042323**** <span id="phone">show number</span></p> 
</div>

而且我計劃使用jQuery去除星號，然後添加我號碼的最後4位數字（我將其硬編碼到JavaScript文件中）。

首先，這是做這種事情的最佳方式嗎？如果是這樣，我該如何刪除星號並用jQuery替換正確的細節？

來源

2013-07-25 Jordan

你可以做的東西來代替整數'替換（「****」，「1234」）'爲例。 – putvande

把你的號碼在標籤這樣的 -

042323**** show number

，然後你可以做到這一點 -

var num = 1234; // hard-coded number - last 4 digits 
$('#phone').on('click',function(){ 
    $('#number').text(function(_,txt){ 
     return txt.replace('****',num); 
    }); 
});

來源

2013-07-25 09:41:23

乾杯，這正是我正在尋找的。 – Jordan

你可以這樣做。

HTML

<div class="personal"> 
    <p>042323**** </p><span pno="0423231212" id="phone">show number</span> 
</div>

Store中的PNO屬性原來的號碼，然後寫jQuery代碼，以顯示它顯示號碼點擊。

jQuery

jQuery("#phone").click(function() { 
    jQuery(".personal").find("p").html(jQuery(this).attr("pno")); 
});

你可以有動畫也同時顯示在您的點擊數。 jQuery中有各種可用的方法。

請參閱本作的動畫功能，各種特效 - http://api.jquery.com/category/effects/

jQuery example for fade animation

jQuery("#phone").click(function() { 
    jQuery(".personal").find("p").html(jQuery(this).attr("pno")).hide().fadeIn("slow"); 
});

來源

2013-07-25 09:41:24

改變HTML：

<div class="personal"> 
    <p><span id="personal-phone-number">042323****</span><span id="phone">show number</span></p> 
</div>

的jQuery：

$(document).ready(function(){ 
     $('#phone').click(function(){ 
     $('#personal-phone-number').html('0438866666'); 
     $(this).hide(); 
     }); 
    });

來源

2013-07-25 09:42:22 niklaz

-1

一個簡單的方法是用整整一

$('#phone').closest('p').html('0438866666');

來源

2013-07-25 09:42:48

比你想要的東西'

042323 **** 0438866666

'。 – putvande

是的，我錯過了閱讀html結構 –

使用正確的信息替換隱藏的文本點擊

回答

相關問題