Api JS code does not seem to react to an onclick - javascript

I've been trying to get this JS code into one of my pages in Magento. Yet it does not let me run the code.
Javascript:
<script>
function emailSend()
{
rrApiOnReady.push(function() { rrApi.setEmail($("#newsletter").val(););});
}
</script>
#newsletter is the id of an <input type="text">
The button who needs to trigger the emailSendfunction:
<div class="actions">
<button type="submit" title="<?php echo $this->__('Subscribe') ?>" class="button" onclick="emailSend()"><span><span><?php echo $this->__('Subscribe') ?></span></span></button>
</div>
I've tried $(document).ready(function() {});
I've tried different methods to get this to work.
When using alert("Hello World"); it's working fine. Anything wrong with the api's given code?
Is there anything wrong with the code?
The Chrome console says this: Uncaught SyntaxError: missing ) after argument list
I've seen that it might be an extra }? Can't seem to find it...
Any tips or tricks to get this to work?

You could try something like this:
$(document).ready(function () {
$("#ButtonID").click(function (event) {
//stuff you want to do
});
});

Related

(index):61 Uncaught ReferenceError: fnspeak1 is not defined

I have created a text to speech programm..and i get a error message which is give below
This is my program..
Html
<textarea id="message"></textarea>
<button type="button" onclick="fnspeak1()">
Play
</button>
Js
function fnspeak1()
{
var msg = new SpeechSynthesisUtterance(document.getElementById("message").value);
window.speechSynthesis.speak(msg);
}
However when run..and when the play button is clicked:
I get a error message like this:
Uncaught ReferenceError: fnspeak1 is not defined
Can someone help me with this..Thanks in advance
Ps;i am a beginner in js
I think you should type more code for me to analyze.
add window.onload = fnspeak1(){ your js code }or Jquery $(document).ready( your funciton here )
is your function under other action? for example: $(".a").on('click',function(){ your function })
if your html and js not in one page ,have you included js in the right way?

jquery does not remove element

I've a page that uses jquery mobile and I've got the following simple problem:
A webpage with a (single) link somewhere in the DOM:
<a data-theme="a" data-role="button" href="https://m.mybet.com">
Smartphone-Version nutzen</a>
And I added a button like this to the html
<input type="button" onclick="javascript:remove_link();"/>
My javascript looks like this:
<script type="text/javascript">
function remove_link() {
console.log("1")
$("a").remove();
console.log("2")
}
</script>
However, when clicking the button the chrome browser tells me:
Uncaught TypeError: Cannot call method 'remove' of null
remove_link
onclick
I also tried empty() instead, same problem. Why?
I allways use ids with javascript, is easier for me. Try this:
<a data-theme="a" id="id1" data-role="button" href="https://m.mybet.com">
Smartphone-Version nutzen</a>
<script type="text/javascript">
function remove_link() {
console.log("1")
$("#id1").remove();
console.log("2")
}
</script>
Okay, I found out. I use native javacript now:
document.querySelector( 'a' ).remove()
does the job.
Try this:
<a data-theme="a" data-role="button" href="https://m.mybet.com">
Smartphone-Version nutzen</a>
<input id="remove_link" type="button" />
<script type="text/javascript">
$('#remove_link').click(function() {
console.log("1")
$("a").remove();
console.log("2")
});
</script>
Looks like you have not loaded jQuery. Make sure you include the <script src="path/to/jquery.js"></script> before calling your function.
Without loading jQuery, your browser is calling the native $ function.
// native jQuery function
function $(id) {
return document.getElementById(id); // may return null
}
The native function may return null instead of an empty jQuery object. It is also searching for an id, rather than a css selector. In your case, an element with id 'a' rather than all anchor elements.

onClick function only trigger once

I've searched a solution or an answer to get me close to the solution for my problem, without any luck. The problem is that I don't know what is actually causing this.
I have the following HTML sructure :
<body>
<div class="showall">
<div class="comentwrapper" style="height:0; width:800px">
</div>
<div class="articol">
Some article over here !
</div>
<input type="button" id="adaugacomentariu" value="Adauga comentariul tau ..." onclick="addBlogComent()" style="float:left; margin-left:5px" /><br /><br />
<div class="showcomment">
Coments go over here ..
</div>
</div>
and the follwing JS code :
function addBlogComent() {
$('.comentwrapper').animate({"height":"340px"});
$('.margine').delay(200).fadeIn(400);
}
function hideComent() {
$('.margine').fadeOut(200);
$('.comentwrapper').animate({"height":"0px"});
}
$(function() {
$('#addblogcoment').on('submit', function(e) {
$('.aratamesaj').fadeIn(300);
$.post('submitcomentblog.php', $(this).serialize(), function (data) {
$('.showcoment').load("blogcoment.php");
$("#addblogcoment").find('input[type=text], textarea').val("");
$('.aratamesaj').delay(5000).fadeOut(800);
$('.comentwrapper').delay(2000).fadeOut(200);
}).error(function() {
});
e.preventDefault();
});
});
My problem is that after .post() and the .load() that .onClick="" is not animating the form anymore.
I don't understand what can be the cause, because the form and the button is on the .showall div and I'm only .load()-ing something in .showcomment div which is a child of .showall.
Maybe someone can see something I'm missing over here .
There is a small fiddle . Don't have the external resources, but that is not the problem, everything is posted and loaded properly.
You can see the whole page at MyWebSite .
Please change your addBlogComent function code as follows, you are animating height but not making element visible.
function addBlogComent(){
$('.comentwrapper').css("display","block").animate({"height":"340px"});
$('.margine').delay(200).fadeIn(400);
};
Within your success callback handler fadeOut is setting display none. That is why its only working once. Your onclick function is being called each time. Hope that answer your question.
$('.comentwrapper').delay(2000).fadeOut(200);

Javascript randomly stopped working

I can't get my Javascript to execute.It randomly stopped working yesterday and I've been messing around to try to get it to work. I tried making a simple code to see if it would work but, I have no luck. Here is the code:
HTML:
<script type="text/javascript" src="js\hello.js"></script>
<form id="hello" onsubmit="return hello();">
<input type="submit" />
</form>
Javascript (in sub folder called js):
function hello()
{
alert("HELLO");
return false;
}
It's really annoying me because all of my Javascript codes aren't working but they were working perfectly fine yesterday. I am not sure what happened...
I meant to make an alert I was just wasn't thinking. It still doesn't work anyways. It's like it isn't even calling the function.
use alert("HELLO"); instead of echo. echo is PHP not javascript.
If you want to output to a speicific tag then use document.getElementById("idOfTag").innerHTML = "HELLO";

onCLick() problem

I have been reading to stay away from JavaScript for a lot of things, however I was messing around with it and it doesnt seem to work (unless I am blind and have missed something)
<SCRIPT LANGUAGE="text/javascript">
function testResults() {
System.out.println("Got into function");
}
</SCRIPT>
And this is my body:
<form action="" method="GET">
<input type="button" value="Save" name="saveType" style="margin:10px;" onClick="testResults()"/>
</form>
From what I have seen of javascipt this should be fine...
Any suggestions?
Use console.log instead of system.out.println...
Javascript is not Java!
A few pointers:
it's type="text/javascript"
why capital letters?
System.out.println is Java
Stay away from JavaScript? Currently it's almost like the opposite, but as almost always it depends on what you have to do :)
to get it work use this instead:
Look here - jsfiddle
<form action="" method="GET">
<input type="button" value="Save" name="saveType" style="margin:10px;" onClick="testResults()"/>
</form>
<script type="text/javascript">
function testResults() {
alert("Got into function");
}
</script>
it is type="text/javascript and not language="text/language" also in javascript you have to use alert().
Javascript doesn't have a standard output like that. You have a few options:
If you have a debugging console running, you can use console.log("log a message")
You can output debug information to a HTML element: document.getElementById("myelement").innerHTML = "message here";
There are loads more options - I'd suggest learning Javascript properly. It's not that much like Java.
Java => System.out.println or System.out.print
Javascript => console.log
:)

Categories

Resources