单击以显示电话号码并单击以拨打电话

Question

I need to create function:

1) show hidden html (phone number) on click

2) After mobile number shown it must be clickable so we can call via mobile

Here's my code:

<div class="category-list-title">
  <h5>
   <a href="javascript:void(0)" class="number" data-last="<?php echo get_post_meta($pid, '_carspot_poster_contact', true ); ?>">
    <span><?php echo esc_html__('Click to View', 'carspot' ); ?>
    </span>
   </a>
  </h5>
</div>

Answer 1

You only need the php to get the data, in this case the phone number.

So this is not a php question, but a html and javascript...

So, here's an example:

HTML:

<div class="category-list-title">
<a id="show" href="#" onclick="show();">View phone</a><br>
<!-- Similar to mailto you tel in html this will allow you to make a call directly -->
<a id="phone" href="tel:555-555-5555">555-555-5555</a>
</div>

CSS:

#phone {
  display: none;
}

JavaScript:

document.getElementById("show").onclick = function() {show()};

function show() {
  document.getElementById("phone").style.display="block";
}

OR jQuery:

$('#show').click(function(){$('#phone').show();});

JSFiddle of the example: https://jsfiddle.net/bm93s2Lc/2/