jQuery - 顯示和隱藏電話號碼的最後4個號碼

如何通過將其替換爲949XXXX之類的東西來顯示和隱藏電話號碼的最後4位數字，並且當您單擊它時顯示其餘數字？jQuery - 顯示和隱藏電話號碼的最後4個號碼

我只是想用jQuery/JavaScript來做到這一點。

2011-06-13 Morne Zeelie

<div id="number" data-last="1234">949<span>XXXX</span></div>

$('#number').click(function() { 
    $(this).find('span').text($(this).data('last')); 
});

例子：http://jsfiddle.net/4fzaG/

如果你想每次點擊進行切換，這樣做：

$('#number').toggle(function() { 
    $(this).find('span').text($(this).data('last')); 
},function() { 
    $(this).find('span').text('XXXX'); 
});

爲例E：http://jsfiddle.net/4fzaG/1/

或者，如果你不想使用自定義屬性，這樣做：

<div id="number">949<span>XXXX</span><span style="display:none;">1234</span></div>

$('#number').click(function() { 
    $(this).find('span').toggle(); 
});

例子：http://jsfiddle.net/4fzaG/3/

編輯：

了完美的降級的緣故，你可能希望有默認視圖顯示號碼，且僅當瀏覽器支持JavaScript混淆了。

<div id="number" data-last="1234">949<span>1234</span></div>

$('#number').toggle(function() { 
    $(this).find('span').text('XXXX'); 
},function() { 
    $(this).find('span').text($(this).data('last')); 
}) 
    .click();

例子：http://jsfiddle.net/4fzaG/4/

來源

2011-06-13 18:48:01 user113716

尼斯使用的[自定義數據屬性（http://dev.w3.org/html5/spec/elements.html#定製數據屬性） – whoabackoff 2011-06-13 18:54:47

謝謝，效果很好！ – 2011-06-13 18:56:36

@ holla22：不客氣。 – user113716 2011-06-13 18:58:46

是的，你可以那樣做（見jsfiddle as a proof）：

jQuery('body').delegate('span[data-replace]', 'click', function(event){ 
    event.preventDefault(); 
    var older_value = jQuery(this).html(); 
    jQuery(this) 
     .html(jQuery(this) 
     .attr('data-replace')) 
     .attr('data-replace',older_value); 
});

，其中電話號碼應該在編碼像：

<span data-replace="555-41-23">555-XX-XX</span>

這將顯示/隱藏每次點擊後的最後一個字母。它將事件綁定到<body>（您可以將其更改爲包含電話號碼的某個容器），並將它們委託給頁面上的適當元素，因此使用AJAX不會成爲問題（您不需要重新附加事件）。

來源

2011-06-13 19:06:20 Tadeck

<div class="overh brkword lheight18 pdingtop5 pdingleft8"> 
    <span class="small">Telefon</span> 
    <strong class="">07XX XXX XXX</strong> 
    <a href="javaScript:void(0);" rel="phone" class="{clickerID:'phone_details','path':'phone', 'id':'WlCT', 'id_raw': '13667831' } atClickTracking link spoiler small link-phone nowrap"> 
    <span>Arata numarul de telefon</span> 
    </a> 
</div>

來源

2013-09-15 10:52:28

非常快答：更多的電話號碼錯誤:)

Telefon : 0 216 457 <span onclick="this.innerHTML='49 47'">XX XX</span>

來源

2013-12-14 03:13:56 alpc

jQuery - 顯示和隱藏電話號碼的最後4個號碼

回答

相關問題