Using a Javascript function to change link with a button - javascript

I have a link that I want to change with Javascript. I've got it working but I want it to all be done on just one line. I must be writing the syntax wrong.
This is what I've got working:
function buttonOne(){
window.location.href='http://www.' + brand() + '.com/';
}
Agent Stats
Ok and when I tried to combine them like this it didn't work:
Agent Stats
I'm sure I've just got the syntax wrong... Any ideas on how to write it so that it works fine?

Your syntax is correct. Using the exact code below works. You'll need to provide more details on the behavior you're experiencing. Are there any errors in the javascript console in your debugger? Does the brand function exist and does it return anything useful?
<html>
<head>
<script>
function brand() { return 'google'; }
</script>
</head>
<body>
Agent Stats
</body>
</html>
EDIT: The debugger is your friend. "Object is not a function" - referring to the anchor tag brand() function call. This is because you have a form with the same name. Rename the form to brand2 and it works fine. http://jsfiddle.net/k6LFB/

Related

Adding onclick=”GoTo(‘URL’) to a WordPress post

I want to add JavaScript attribute “onclick” with “go to” function inside a “span” tag: onclick=”GoTo(‘URL’) to a post on WordPress website.
When I add this code to a post:
<span class="aff" onclick="GoTo('URL')" target="blank">text</span>
nothing happens when you click on the "text" and there is an error “Uncaught ReferenceError: GoTo is not defined at HTMLSpanElement.onclick” at the console.
Please, help to fix the issue.
Add this ->
<script type="text/javascript">
var GoTo=function(url){
window.location.replace(url);
}
</script>
Can you add the code for your Goto function hard to know what wrong without that?
Assume something like
function GoTo(url){
window.location = url;
}

click on an image link when a web page is opened using javascript

I'm new in Javascript and this is my code
<!DOCTYPE html>
<html>
<body>
<img src="http://www.example.com/1/img" border="0" />
<script>
function () {
document.getElementById('test').click();
};
function();
</script>
</body>
</html>
I was trying to open that link when the web page is loaded but I make some errors. Any help?
The way you define and invoke function is not correct. This is invalid syntax construction as function declaration (statement staring with function keyword) requires a name to be valid javascript code.
So you either give function a name an invoke it:
function somename() {
document.getElementById('test').click();
};
somename();
.. or use IIFE (immediately-invoked function expression):
(function() {
document.getElementById('test').click();
})();
However, in your case you don't really need as you don't use it for what it's really useful, i.e. creating new scope. Simple line
document.getElementById('test').click();
would be just enough.
You don't need the example function... remove onclick="example(this)...". Since you are clicking via javascript, the normal function of the click is to go to the link specified in the href attribute anyway.
If you just want to open a new link on page load, you can also remove all the body and just use the following:
<body>
<script>
window.location.assign = "http://example.com";
</script>
</body>
Do it like this:
<!DOCTYPE html>
<html>
<body>
asdf
<script>
document.getElementById('test').onclick();
function yourfunction(){
alert("clicked");
}
</script>
</body>
</html>
What we do here is assigning the function "yourfunction()" to "onclick" of your anchor (the element). Due to the fact that your code is automatically executed when you reload the page (note that we've just posted a line of code into the script tag) you can trigger the onclick event just by using ".onclick()".
However, you're executing "yourfunction()" every time you reload the page and as you click your anchor.
The function itself is pretty boring. It just makes an alert (small window with a message and ok button) which says "clicked".
Further reading:
How can I trigger a JavaScript event click
https://developer.mozilla.org/de/docs/Web/API/GlobalEventHandlers/onclick
https://developer.mozilla.org/de/docs/Web/API/Window/alert
Some further advice. I think you are trying to achieve a "redirection" to another site as soon as you got to a domain. You probably want to do stuff like redirecting a typo ("gogole.com") to your "real" domain (google.com). This shouldn't be done with Javascript! You have to configure your webserver to do so (it's pretty easy). See this for example.
However, ther is also another approach to achieve this:
<meta http-equiv="refresh" content="0; url=http://www.example.com/">
Put this line of code into the of your document.

Run JavaScript embeded in HTML from FireBug

I have just started working through Professional JavaScript for Web Developers and am trying to run the code as I go along. I have hit a wall early on with trying to embed JavaScript in a HTML document. If I define a function and call it in the same document, nothng happens. Similarly, if I define a function in the document and call it from either the Firefox scratchpad or FireBug nothing happens. I can however run the whole thing (define the function and call it) from the scratch pad or FireBug.
The code I am using for the page is:
<!DOCTYPE html>
<html>
<head>
<title>Test Page</title>
<script type="text/javascrtipt">
function compare(a, b) {
if (a < b) {
alert ("A is less than B");
} else if (a > b) {
alert ("A is greater than B");
} else {
alert ("A is equal to B");
}
};
</script>
</head>
<body>
<p>Paragraph 1</p>
<script type="text/javascript">compare(5, 6);</script>
</body>
</html>
I have found similar questions like the one below which I think answers my question but I don't understand it enough to apply it to my scenario. How would I make the function above global (if that is whats needed here)?
Calling custom functions from firebug console
Thanks,
Ger
The problem here is not in your logic, rather it is in a simple typing error.
Where you specify the script type in the head, you misspelled javascript - correct that and the script executes.
Further to this, it may be worth mentioning that, when using the HTML5 doctype, you omit the script type if you wish because this is now the default for HTML5 documents.
After correcting the typo "text/javascrtipt" the compare function can be successfully called from Firebug console (command editor) with, e.g.
compare(3,4);
and a following click on "execute". Tested with Firefox 24.0 / Linux.

onbeforeunload event not firing in my code, but other examples work?

As usual, I want to alert users to unsaved changes when leaving a page. I have this test page:
<html>
<head>
<title>Testing</title>
<script language="JavaScript1.1" src="https://127.0.0.1:8443/scripts/base.js"></script>
<script language="JavaScript1.1" src="https://127.0.0.1:8443/scripts/edit.js"></script>
<script language="JavaScript1.1">window.onbeforeupload=moveAway</script>
</head>
<body onLoad="init()">
Google
</body>
</html>
The moveAway function is defined in "edit.js" like this:
function moveAway ()
return "foo";<br>
}
The event doesn't fire, or at least it just leaves the page silently (using IE8, Firefox 15, and Chrome 20). I've tried breakpointing the function in Firebug and it never gets to the breakpoint. I've tried it from the web server (an SSL server, the test version of which runs at 127.0.0.1:8443) and I've tried opening the file directly with the browser (which is why I used absolute URLs for the first two <script> tags). I've tried removing the "src=" attribute from the script tags.
On the other hand, this page has an example which does work (at least in Firefox):
https://web.archive.org/web/20211028110528/http://www.4guysfromrolla.com/demos/OnBeforeUnloadDemo1.htm
There is also a very similar example at MSDN which also works:
http://msdn.microsoft.com/en-us/library/ms536907%28VS.85%29.aspx
I really can't see the difference between what they do and what I'm doing. can anyone tell me why their code works and mine doesn't?
use jQuery bind function.. it works great for me..
see bellow
$(window).bind('beforeunload', function() {
return "Want to leave?";
});
onbeforeupload , really ? it should be onbeforeunload. Is that a spelling mistake, or is that how your actual code is ?
You have a syntax error, the function should be:
function moveAway () {
return "foo";
}

Onclick in <a> cause reloading of the page insted of executing JS code

My URL: http://www.example.com/?product=3&url=XYZ
My code:
link
After click, page is reloading, instead of executing foo() function.
JS is enabled. Body of foo():
function foo() { alert("sss"); }
Probably, this problem is caused by URL of my site. XYZ parameter is a url of a website but with something like "%C5%82%C3%B3" instead of special characters (something like after using htmlspecialchars()).
What is interesting, after click the page is reloaded with the "normal" URL, something like: http://www.example.com/?product=3&url=http://www.example.com (WITH special characters like " / ").
What can I do to resolve this problem?
EDIT
Above code works fine. Thank you for your time.
Yeah, there's definitely something else going on here. Here's a minimal example that works just fine:
<html>
<body>
link
<script type="text/javascript">
function foo() { alert("hi"); }
</script>
</body>
</html>
Assigning onclick inline is not a good practice, and you should be doing something like
<a id="someId" /* ... */ >
// ...
<script type="text/javascript">
function foo() { alert("hi"); return false; }
document.getElementById("someId").onclick = foo;
</script>
but in any case, the most likely culprit is that your script has a syntax error somewhere and is not loading at all. You can verify this by setting onclick="return false". If that doesn't work, it's likely you have some other event handler that's being triggered. But because the above -- all we know of your code -- works, it's unlikely anyone here can diagnose what the problem is without more information.
Edit
Nevermind this, I fully assumed your code wasn't working and the below did. But I guess the code you posted was already correct.
On a seperate note, you should avoid using attributes like onClick, create event handlers instead (I suggest looking at jQuery).
i tried the same code in my systm.the code is workin and the alert box is visible.
My code:
<a href="#" onclick="foo();return false;">link/a>
and javascript is
<script type="text/javascript">
function foo()
{
alert("sss");
}
</script>
i am using vs2008

Categories