I'm busy on little JavaScript item, but I got confused by the next rule:
<img src="images/icons/collapse.gif"><br/>'
It doesn't take the onclick remove map action. I don't know what I have to put between the () to make I can put text there. Does somebody have the solution?
Try just :
onclick="removeMap('test')"
if test is a variable:
onclick="removeMap(test)"
The \" is to scape the closing double quote of the onclick event. In this case I don't see any use in your calling. When used event functions in the html tags just like your onclick event, as html uses double quotes for the attributes you need to use the single quotes in your inline javascript functions.
By the way, have you checked about JQuery JavaScript Library. As you are starting coding javascript it's good to know your options.
Or just stop writing javascript inside of your HTML tags, just call functions and put your code in your functions... far much readeable !
How about:
<img src="images/icons/collapse.gif"><br/>'
You should use an editor that properly highlights strings (and what is going on should be obvious)
Escaped quotes don't have any special meaning in HTML. Instead, the browser will see your line as:
<a href="#"
onclick="removeMap('+ \"
test\
" +')"
style="float:right; margin-right: 30px;"
>
Where the onclick would be broken Javascript, and there would be two attributes in the tag (test\ and " +')") that it doesn't recognize and doesn't know what to do with.
Related
How to do that when you click on the link did not work event.
Example:
HTML
<div><p onclick='location.href=/link_site'>message and link http://example.com/abcde</p></div>
I clicked http://example.com/abcde and working location.href, how to make when you press on the link to the event did not work location.href?
Unless you are working inside PHP (or other language?), you do not need the backslashes to escape the double-quotes.
Escaping tells the processor/server to read the next character as a literal entry instead of instruction code. (This is not a technical explanation).
In HTML5, you don't need single or double quotes, but it is good form to contain your information.
<div><p onclick='location.href=link_site'>message and link http://example.com/abcde</p></div>
No.For blocking click event or something like this,there are ideas called preventDefault and stopPropagation.You can search those names and read what do these mean.Here is a link of click events.maybe it can help you.
http://www.w3docs.com/learn-javascript/javascript-events.html
The following is working when the content is no space
<a onclick=fbShareDialog("{\"name\":\"aaaaaaa\"}">
but if there is a space between
<a onclick=fbShareDialog("{\"name\":\"bbbbb bbbbb\"}">
it throws Uncaught SyntaxError:unexpected token illegal
as i think all the content is in quotation , why not works?
thanks in advance
You need to make sure you escape the space and put everything within double quotes.
I can't test it out now but try something like.
Also, it may be a better idea if you didn't write this inline and wrote a function to catch the click event instead.
You're implying a quoteless-attribute, which is really bad form in HTML but unfortunately still allowed due to HTML's sordid history. The attribute is 'onclick', which actually includes fbShareDialog, but that isn't in quotes.
Try:
<a onclick='fbShareDialog({"name":"bbbbb bbbbb"})'>
Or better yet, bind your click events in a .js file for your app, not onclicks in the html.
I have an html component that makes a variable amount of rows in a table. Inside this component there are several css classes e.g
<div class="row" style="margin-left:0">
How do I embed this big chunk of html in a javascript forloop? The only way I know how is to use document.write("") but the quotation marks in the classes will mess that up.
UPDATE:
Any ideas why the tags and everything inside them is ignored when using innerHTML??
Make a div with an id of someDiv (or whatever you want) for this to work.
document.getElementById("someDiv").innerHTML = '<div class="row" style="margin-left:0">';
I used single quotes to wrap the string in order to avoid conflict with the double quotes in the HTML.
You'll need to escape your quotes in your javascript.
alert('Oh, heya, I didn\'t see you, so "Hello"');
JavaScript isn't great for expressing HTML as, amongst other things, it lacks Heredoc syntax which results in you having to escape any string literals (as suggested by #DavidYell).
It might be worth considering the use of a templating engine such as Mustache.js or Underscore.js
I need to pass html to javascript so that I can show the html on demand.
I can do it using textareas by having a textarea tag with the html content on the page, like so: <textarea id="html">{whatever html I want except other textareas}</textarea>
then using jquery I can present it on the page:
$("#target").html($("#html").val());
What I want to know is how to do it properly, without having to use textareas or having the html present in the <body> of the page at all?
You could use jquery templates. It's a bit more complex, but offers lots of other nice features.
https://github.com/codepb/jquery-template
Just save it in a variable:
<script type="text/javascript">
var myHTML = '<div>Foo Bar</div>';
</script>
As far as I know there is no painless way to do this due to the nature of html and javascript.
You can store your html as a string in a javascript variable such as:
var string = '<div class="someClass">your text here</div>';
However you should note that strings are enclosed within ether ' or " and if you use ether in your html you will prematurely end the string and cause errors with invalid javascript.
You can decide to only use one type of quote in your html say " and then ' to hold strings in javascript, but a more concrete way is to escape your quotes in html like so:
<div \"someClass\">your text here</div>
By putting \ before a special character you are telling it that it should ignore this character, however when you go to print it out the character will still print but the \ character won't, giving you functioning html.
Just like remy mentioned, you can use jQuery templates, and it's even cooler if you combine it with mustache! (which supports a lot of platforms)
Plus the mustache jQuery plugin is way more advanced than jQuery templates.
https://github.com/jonnyreeves/jquery-Mustache
This little line of code here is from a shopping cart:
Add To Cart
Firebug's console shows: "missing ) after argument list". Clearly the ')' isn't missing! But I suspect it has something to do with the escaped char
'
since the other similarly formatted links without apostrophes in the name= argument are working fine.
Thoughts?
onclick="simpleCart.add( 'name=The Devil's Sneakers'...
Is an HTML attribute with the apostrophe escaped at an HTML level. It is exactly the same as saying:
onclick="simpleCart.add( 'name=The Devil's Sneakers'...
with the obvious problem with the string closing too early. HTML-escaping doesn't help you because the HTML-escape is only needed to encode the characters that are special to HTML. That would include a double-quote character but not a single quote, since you've used double-quotes to delimit the attribute value.
The apostrophe isn't special to HTML here, but it is to JavaScript. You need to use JavaScript string literal escaping, and in that kind of escaping you need backslashes:
onclick="simpleCart.add( 'name=The Devil\'s Sneakers'...
Either way, it's clear that escapes inside other escapes are really confusing and this is another good reason not to use inline event handler attributes. Instead, in plain JavaScript:
<button type="button" id="foo">Add to cart</button>
<script type="text/javascript">
document.getElementById('foo').onclick = function() {
simpleCart.add("name=The Devil's Sneakers", 'price=10', 'shipping=0', 'quantity=1');
};
</script>
(I used a button because what you've got isn't a link that goes anywhere. You can style it to look like a link instead of a button if you prefer, but it's better not to have a link if none of the normal affordances of links, like middle-click or right-click-bookmark make any sense.)
Escape apostrophes with \x27. This code should work:
Add To Cart
Try \' instead of '
It works well.
<html>
<body>
Add To Cart
Add To Cart
</body>
</html>