I have found lots of messages about simulating an anchor click with javascript. Most using the "location" function, which doesn't work for me because I do not want to redirect anywhere. My anchor has href="tel:..." to invoke the iphone's phone function.
I can't have an anchor for clicking, so I wanted to have javascript/jquery simulate that click when a user presses a button, for example. How could I do this (if, indeed, it is even possible)?
Thanks
You can trigger the click event for the anchor on on the click of the button
$('#button1').on('click', function() {
$('#anchor1').click(); // triggering the click event on click of the button
});
Check this FIDDLE
$(function() {
$('a').on('click' , function() {
alert('Fired using button !!')
});
$('#button1').on('click' , function() {
$('a').click();
alert('Button Clicked !!')
});
});
Try this:
$(your_button).trigger('click')
You could just trigger the click event...
$("a.phonenumber").click();
Here is a simple example of how to accomplish this -
$(function(){
$("#b1").on('click',function(){
alert("pressed b1!");
});
$("#b2").on('click',function(){
$("#b1").trigger('click');
alert("pressed b2!");
});
});
Clicking on the first b1 button will trigger an alert. When clicking the second b2 button, first we "trigger" a click event on the first button (which will execute it's alert), and then alert the second value.
DEMO
I know the questions asks not to use the location function, but please try this out:
HTML:
<button class="click-to-call" data-phone="2125551234">call</button>
jQuery:
(could easily be written with only javascript too if you wanted to)
$('.click-to-call').on('click',function(){
window.location.assign('tel:'+ $(this).data('phone'));
});
Related
I am trying to use a popupwindow function. The problem is, it works only on the second click and so on. If I refresh the page, it will not work on first click. Why does it happen? Below are my codes,
$(document).ready(function(){
function popup(e){
e.preventDefault();
$(".popupwindow").popupwindow();
}
$('.popupwindow').on("click", popup);
});
Link that use the function:
Click Here
I call a function when press the textbox. this is the code for that
onclick="GetColorBack()"
but only when click on the textbox. but if I move with TAB it wont call GetColorBack function.
how can I do that?
PS: not the CSS focus type
For "vanilla"-javascript use onclick="GetColorBack()" onfocus="GetColorBack()"
I think onfocus="GetColorBack()" will be enough, cause clicking lead to focus-event
You can use focus on the textbox. This will work with clicks and tab overs.
Example:
$( "#btnTest" ).focus(function() {
//code
});
The problem is I would like to fire only once when the mouseevent function is triggered, e.g.
$(document).ready(function() {
$("#menu").click(function(){
$('#menu_div').show();
menu_function();
});
$("#menu_close").click(function(){
$('#menu_div').hide();
});
});
function menu_function(){
$(".select_li").live(
"click",
function() {
alert("test");
}
);
}
The example has two objects, menu and menu close; when the menu press, the ui box is shown, and run the menu_function , which fires an alert test message. The problem is when the menu_close is clicked and box closed, and open it again, the alert test will fire twice. I observe that the times of div box close and open again is the same as the fire times of the function, how can I fix it?
If I would like not using unbind, are there any better solution?
Your menu_function() is NOT just firing an alert test message - it is adding a live click listener to everything in the DOM that has a class of "select_li" that fires a test alert. This means that every time you click on #menu you are adding ANOTHER listener to .select_li - so if you click #menu 10x, you should have 10 listeners for each click of .select_li.
If you are truly trying to JUST show an alert when you click on #menu, your menu_function() should only look like this:
function menu_function() {
alert("test");
}
http://jsfiddle.net/wmuYq/
I want to eliminate an awkwardness: the user has to click the submit button twice to submit the text.
What should I do to make it work with one click?
You can set a timeout: http://jsfiddle.net/wmuYq/1/
document.getElementById("text1").onblur = function () {
var target = this;
setTimeout( function () {
target.style.height='36px';
}, 250);
}
You could use the onmousedown event on the submit button to submit the form:
document.getElementById("submitButton").onmousedown = function() {
this.form.submit();
}
For the above example to work, you would need to give the button an ID. Also, you would need to change the name of the submit button from "submit" to something else, because otherwise it overwrites the submit property of the form element.
This works because the mousedown event will be triggered on the button before the blur event is triggered by the textarea.
Here's a working example.
Well for one thing you have no form, so I am not sure how it submits at all.
Wrap your code in a form and add an action and it should work fine :-)
This might work. Untested
Remove the onblur event from the textarea and place it as on onclick on the input
onclick="document.getElementById('text1').style.height='36px'"
Revised fiddle: http://jsfiddle.net/jasongennaro/wmuYq/2/
We have a form within a modal window.
I have a submit button, which saves to db. And I would like to simultaneously close the modal window.
The function for close is correct, just not my usage lol.
<input type="submit" name="upload_thumbnail" value="Save Thumbnail" id="save_thumb" onclick="$.lightbox().close();" />
The modal window , contains iframe with php / html within it, this form is part of that iframed html code.
Any suggestions ?
To close the dialog when the element with ID save_thumb is clicked:
$('#save_thumb').click(function ()
{
$.lightbox().close();
});
You might want to bind to its parent form's submit event, however, since keyboard events won't trigger the click handler:
$('#my_form_id').submit(function ()
{
$.lightbox().close();
});
Whichever you decide on, make sure to wrap it up in a document ready handler.
Add this javascript to your file and remove the onclick attribute on your button. Make sure the javascript is added inside tags.
$(document).ready(function(){
$('#save_thumb').click(function (){
$.lightbox().close();
});
});
Use the bind function,
$(function() {
$("#save_thumb").bind("click", function() {
$.lightbox().close();
});
});