I want the onclick event of a link <a href='#' onclick='function()'> to activate when the enter button is pressed. This is supposed to work, but I don't seem to get it working. Trigger a button click with JavaScript on the Enter key in a text box . And this also didn't work for a button.
The reason for this is probably because I run and load most of my interface in with ajax because of loading issues, certain calculations take quite some time, so I figured I should use ajax to show my page elements so I can update real time instead of making the user wait 5 to 10 seconds for the server. This however seems to make the code below not working.
My code
//This comes from a different php file which is read out on the server with
//readfile() in php after an ajax call. In other words it echoes the
//contents of this file on the page including this link.
echo "<a href='#' onclick='dosomething()' ID='Enter'>Click me</a>";
//js
$("#Enter").keyup(function(event){
if(event.keyCode == 13){
$("#Enter").click();
}
});
function dosomething(){
//activate some code depends on the link.
}
So how do I get this working. Activating the onclick on enter pressed on a link imported via ajax? Is this even possible?
Working Demo
Try this,
Use keypress event and it won't fire on #Enter as it is an <a> tag.
$(document).keypress(function(event){
if(event.keyCode == 13){
$("#Enter").click(); //OR $("#Enter").trigger('click');
}
});
function dosomething(){
alert('..');
//activate some code depends on the link.
}
You can do like
$("#Enter").keypress(function(event){
if(event.keyCode == 13){
dosomething();
}
});
Even you can Trigger it like
$("#Enter").trigger('click');
Related
I am trying to create a dynamic hyperlink that will download an image retrieved from the server.
The code I am using:
HTML:
<a class="btn" id="controlDownloadJPEG" download>Save & Download</a>
JS:
this.downloadJPEGClickHandler = function() {
CollageCore.downloadJPEG(function(data){
$("#controlDownloadJPEG").attr("href", "../file/fileStore.action?fileName=/" + data[0].AttachmentUrl);
});;
return true;
};
The href is getting changed on click, but the link itself is linking to the href set before my JavaScript executes. The first click does nothing as there is no default href and the second click will download what the first click should have downloaded.
I have seen suggestions to use JavaScript window.href instead of relying on the html tag itself. The reason I need to use the html tag is for its download functionality.
You are treating an asynchronous call as it it is synchronous. It is like ordering a delivery pizza and expecting it to be there as soon as you place the order. That does not happen unless you are standing in the restaurant and it is already been made.
You need to cancel the click and fire the page change manually when the call comes back. So you want to use window.location.href = "new path"; instead of setting the href.
this.downloadJPEGClickHandler = function() {
CollageCore.downloadJPEG(function(data){
window.location.href = "../file/fileStore.action?fileName=/" + data[0].AttachmentUrl;
});
return false; //or preventDefault if you pass in event object
};
If you are are attaching this activity to an onClick(event) handler you should be able to stop the redirect by passing in event.preventDefault();
cite: http://api.jquery.com/event.preventdefault/
Prevent the default click behavior, change the href attribute, and then imitate the click. Should work.
$( "a" ).click(function( event ) {
event.preventDefault();
$("#controlDownloadJPEG").attr("href", "../file/fileStore.action?fileName=/" + data[0].AttachmentUrl);
$(this).click();
});
I have two links on the page
Form
Image
I made a simple click.
$('a[href="#Form"]').on('click',function(){
alert("hi");
});
also I'd like HASH works as well.
if(window.location.hash = "#Form"){alert("hi");}
Once the page loads, it shows ALERT, then I click Image link, the url becomes www.myweb.com/#Image, if I press (history) button, the url looks www.myweb.com/#Form BUT alert("hi") isn't working anymore.
Can I make it still works even I press button?
You could try something like:
$(window).on('hashchange',function(){
if(document.location.hash == '#Form'){
alert('hi')
}
});
First your condition is wrong:-
if(window.location.hash = "#Form"){alert("hi");}
to
if(window.location.hash == "#Form"){alert("hi");}
Other thing you need to bind hashchange event. Not all browsers support this event. In that case you need to check hash changes using setInterval function of javascript.
For some reason, this script isn't working in Safari (tested on Windows, think it happens on Mac, too, though):
$("#searchTerms").focus(function() {
$(document).keypress(function(e) {
if(e.which == 13) {
$("#searchBtn img").click();
}
});
});
jsFiddle: http://jsfiddle.net/ux86V/
The script is supposed to click an image when a user presses enter while focused on a search box (it has to be set up this way, it's tied in to some weird third party service).
EDIT: It doesn't appear to work at all in the jsFiddle, but it does, so don't just assume the entire script is bad. I think jSFiddle just prevents redirects, and I have it set up to redirect to google.com for the example.
EDIT 2: It appears to be an issue with .click(). Is there an alternative to this that I could use, or is .click() the only way to register a click on an element?
EDIT 3: After more testing, it seems like the jQuery click event is somehow not working properly. It may have something to do with the way the form is submitted, I'm not sure. Link to live demo: http://www.weblinxinc.com/beta/blue-sky-marketing/demo/
13 is the code of enter key which is a special key , you can catch it on keyup only
try to use trigger();
$("#searchTerms").focus(function() {
$(document).keyup(function(e) {
if(e.which == 13) {
$("#searchBtn img").trigger("click");
}
});
});
I need a javascript 'OK'/'Cancel' alert once I click on a link.
I have the alert code:
<script type="text/javascript">
<!--
var answer = confirm ("Please click on OK to continue.")
if (!answer)
window.location="http://www.continue.com"
// -->
</script>
But how do I make it so this only runs when clicking a certain link?
You can use the onclick attribute, just return false if you don't want continue;
<script type="text/javascript">
function confirm_alert(node) {
return confirm("Please click on OK to continue.");
}
</script>
Click Me
Single line works just fine:
<a href="http://example.com/"
onclick="return confirm('Please click on OK to continue.');">click me</a>
Adding another line with a different link on the same page works fine too:
<a href="http://stackoverflow.com/"
onclick="return confirm('Click on another OK to continue.');">another link</a>
just make it function,
<script type="text/javascript">
function AlertIt() {
var answer = confirm ("Please click on OK to continue.")
if (answer)
window.location="http://www.continue.com";
}
</script>
click me
In order to do this you need to attach the handler to a specific anchor on the page. For operations like this it's much easier to use a standard framework like jQuery. For example if I had the following HTML
HTML:
<a id="theLink">Click Me</a>
I could use the following jQuery to hookup an event to that specific link.
// Use ready to ensure document is loaded before running javascript
$(document).ready(function() {
// The '#theLink' portion is a selector which matches a DOM element
// with the id 'theLink' and .click registers a call back for the
// element being clicked on
$('#theLink').click(function (event) {
// This stops the link from actually being followed which is the
// default action
event.preventDefault();
var answer confirm("Please click OK to continue");
if (!answer) {
window.location="http://www.continue.com"
}
});
});
Alright so I have a text field that will have a bar code scanned into said text field. It will search the database and return information in the form of a submit button. I am using this code to simulate a click on the submit button.
if($.browser.msie){
//simulate a click on the button
$("#search").keyup(function (e) {
if(e.keyCode == 13) {
$('input:submit').click();
}
});
}
The problem with this code is that it takes all of the keystrokes and then clicks the button that many times. This submit will represent data that gets written into the database, so if the bar code was abc123 it would do this action 6 times, but I just need it to do it once. How do I fix this? My code works in FF and Chrome, but not IE, which is the one I need to get this to work in. Grrr I hate IE so much!
Why do you need to "click" that submit button? Why don't you just submit the form like:
$("#search").blur(function(){
document.myform.submit();
});
Your barcode reader will do this for you.
Try to get code like this:
var keyCode = (window.event) ? e.which : e.keyCode;