I want to link to a HTML file from a JavaScript on-click function. For that I used following function.
onClick: function () {
document.link("about.html");
}
But this is not working. So how can I add link inside of onClick function. Can anyone help me.
Usually I use this code:
<input type="button" value="Go to page" onclick="location.href='mypage.html'"/>
Anyway u can try:
onClick: function () {
location.href("about.html");
}
You can use the onclick property of a button element in HTML that will trigger a function when the button is pressed.
<button onclick="myFunc()">click me</button>
In your JavaScript file, you can then create the myFunc() function that will be called and executed soon after.
function myFunc() {
window.location = "otherpage.html";
}
According to W3C it's safer for cross-browser compatibility to use window.location rather than document.location.
onclick:function(){
window.navigate('your_url');
}
Try this:-
<input type="button" value="Go to page" onclick="openUrl()"/>
function openUrl() {
window.open("about.html");
//or
//window.location.href= "about.html";
}
Related
I have a button which redirects the user to the previous page:
<button id="back" onclick="location.href='..'">Back</button>
And I want to change his location to two pages before.
What's wrong with this code?
document.getElementById("back").setAttribute("onclick", function(){window.location.href='../../'});
or this
document.getElementById("back").addEventListener("click", "location.href='../../'");
or this
document.getElementById("back").onclick="location.href='../../'";
for some reason none of them work properly and my button remains unchanged... Google doesn't help!
Try
document.getElementById("back").addEventListener("click", function(){
window.location.href='../../';
});
You can do like below
<button id="back" onClick="GoBack()">Back</button>
<script>
function GoBack(){
window.location.href='../../';
}
</script>
And If you want to go back to the previous page you can do like bellow
<button id="back" onClick="GoBack()">Back</button>
<script>
function GoBack(){
window.history.go(-2);
}
</script>
I think this is better
document.querySelector("#back").addEventListener("click", () => window.history.go(-2));
you can use this windows.history.go(-2);:
<button onclick="windows.history.go(-2)">Back</button>
or save address of previous pages and reference to them.
setAttribute for onclick doesn't works in some browsers. Read about it here.
Syntax for addEventListener is
target.addEventListener(type, listener [, options]);
Read about it here
So, Working code
document.getElementById("back").addEventListener("click", function(){
window.location.href='../../';
});
I have a big JavaScript Code in a html file like
<script>CODE</script>
Now, this whole paragraph should only execute if the user clicks on a button (or something like that)
for example
<button id="MyButton" onclick= ???>MyButton</Button>
Thanks Guys :)
Wrap your code in a function, and specify that function in your button onclick.
<script>
function doSomething() {
CODE
}
</script>
<button id="MyButton" onclick="doSomething()">MyButton</button>
How to we call a function from an external JS file on click?
JS file on /Content/js/pj_no.js
function alertMe(){
alert("me");
}
C#
#Scripts.Render("~/Content/js/pj_no.js")
<input value="親コード新規登録" type="button" onclick="alertMe()" />
Assuming this is in the same file iin my csHTML it is working fine. But when I put it on the external JS it is not calling anymore.
I know my JS is in the right directory as if i trigger an $(document).ready(function () {} it is calling the alert. But I need it to be on click event.
Help please
$(document).ready(function (
alert("me"); -- This is working,
function alertMe(){ //cant call this function
alert("me");
}
)});
$(document).ready(function (
alert("me"); -- This is working,
// NOTE: Following becomes local function. and will not work
function alertMe(){ //cant call this function
alert("me");
}
)});
You need to make it global to get called. Please declare it out side of document ready function.
$(document).ready(function (
alert("me"); -- This is working,
)});
// NOTE: Following will work
function alertMe(){
alert("me");
}
you can bundle it first in App_Start > BundleConfig.cs inside RegisterBundles
bundles.Add(new ScriptBundle("~/bundles/pj_no").Include(
"~/Content/js/pj_no.js"));
then you can call it in your view :
#Scripts.Render("~/bundles/pj_no")
<input value="親コード新規登録" type="button" onclick="alertMe()" />
You just need to simply put the external js function in script folder.
Then simply call include it on view
#Scripts.Render("~/Scripts/pj_no.js")
Then simply call the function on onclick
<input value="親コード新規登録" type="button" onclick="alertMe()" />
Try the following code, it will work
window.alertMe = function(){ //can call this function
alert("me");
}
Your code is not working because your function gets added to the local scope of $.ready function. By using window.alertMe your function will be added to global scope even if it is inside the $.ready method
It is working now with this way.
In MVC we rarely uses onclick event on input element, usually we use jQuery like this:
$("#elementname").click(function () {
alertMe();
});
<input value="親コード新規登録" type="button" id="elementname" />.
– Tetsuya Yamamoto
I want to execute a command by the click of a button, and not when the page loads.
function hey() {
alert('bla');
}
Do I add something to the code above or to the button?
<input type="button" value="Click Me" onclick="hey()" />
Have you taken the time to type in your question into the magical Google box yet? Surely you'll see something like this:
<input type="button" value="Click me, now" onclick="hey()" />
Say you have the function that alerts a window to the user.
<script type="text/javascript">
function showMe() {
alert('You clicked on the button');
}
</script>
<button onclick="showMe()">Button</button>
This will make sure that the function is only called when the button is clicked upon and not when the page is loaded.
Okay, so you have a code that should work for alerting something on the click of a button. But you state that the code is running on page load. You have to check you code, looking for:
An onload attribute on the body tag, something like <body onload="hey()">
A call to hey somewhere else on your js code. Look for hey().
Maybe a reference to the button followed by a call to .click()
There is something else on your code causing the function to be called, you'll have to scan your code to find out what it is.
Below is the html code:
<input type="button" id="abc" name="TechSupport_PartsOrder" value="Open Editor" />
Below is the JQuery Code:
$('#abc').click(function () {
alert('x');
});
Now when i put the above JQuery code to JS file it does not work, while when i put the same in page it works fine. Why this is happening i don't knw.
And if i call the function onclick of button like this:
<input type="button" id="abc" name="TechSupport_PartsOrder" onclick="abc()" value="Open Editor" />
JQuery:
function abc()
{
alert('x');
}
it works well..
Wrap the code in a ready handler:
$(function() {
$('#abc').click(function() {
alert('clicked');
});
});
Did you make sure that the event handler is getting defined after the DOM has loaded? This is why jquery recommends putting all your code in
$(document).ready(function(){
//XXX code goes here
});
you're event handler is probably try to be assigned before the element has been loaded into the DOM.
Does the following solve the problem?
$(function(){
$('#abc').click(function () {
alert('x');
});
})
Your code may be getting called before '#abc' has been added to the DOM