how to call a phone number through javascript without using <a> tag?
The certain answer for the title of the question, hence, without using <a>
tag is to make a helper function to simulate the action of <a href="tel:
:
const simulateCall = phoneNumber => window.open(`tel:${phoneNumber}`, '_self');
The target _self
causes we have an exact look like call simulation just like clicking <a href="tel:
.
Now the simulateCall
helper function can be used anywhere. like my case:
const callHandler = phoneNumber => () => {
// I want to do something here then make a call
simulateCall(phoneNumber);
};
~~~
<SomeComponent onClick={callHandler} ...
Find the cell content with jQuery, replace the "Phone:" part and make it a link. The selection of the cell with a class is one way of doing it. Another would be to select in the real table the cell with a code similar to "the second cell in each row of the table". Here a working example:
<html>
<head>
<title>Test</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
$(function() {
$('.phonecell').click(function() {
var PhoneNumber = $(this).text();
PhoneNumber = PhoneNumber.replace('Phone:', '');
window.location.href = 'tel://' + PhoneNumber;
});
});
</script>
</head>
<body>
<table>
<tr>
<td class="phonecall">Phone: 900 300 400</td>
</tr>
</table>
</body>
</html>
Change this:
<table>
<tr>
<td>Phone: 900 300 400</td>
</tr>
</table>
to:
<table>
<tr>
<td>
<a href="tel:+900300400">Phone: 900 300 400</a>
</td>
</tr>
</table>
You can simply add an onclick
handler to your <tr>
tag, then call window.open("tel:+1800229933");
.
Like so:
<table>
<tr onclick="window.open('tel:900300400');">
<td>Phone: 900 300 400</td>
</tr>
</table>