so I am trying to create a link within my page but for some reason it is getting disjointed the code is
data = data + "<li><a href='#' onclick='History.pushState({state:null},'article,"+rtndata[j].id+"','article'); return false;'>" + rtndata[j].title + "</a></li>";
rtndata[j].id is an id number and rtndata[j].title is a title both are being pulled from a db but when it renders in the browser it becomes
<a false;'="" return="" article,41','article');="" onclick="History.pushState({state:null}," href="#">Newsflash 5</a>
so what I to render is actually
<a href="#" onclick="History.pushState({state:null},'article,41','article'); return false;'>"Newsflash 5</a>;
Can anyone help me?
The value of the onclick attribute is enclosed within single quotes. Because of this, you have to either use " or " (only for values) if you have to use quotes inside the attribute.
Because your JavaScript string is enclosed within double quotes ("), the double quotes have to be escaped before they can be used: "....onclick='...\"....'....";.
To fix your code, I have decided to use double quotes (escaped) instead of single quotes:
data = data + "<li>" + rtndata[j].title + "</li>";
Detailled table:
JS string marker Attribute marker Valid attribute value markers
" \" ' "
" ' \" "
' " \' "
' \' " "
Related
I am trying to create an email with a multi line body using:
<a href={"mailto:" + this.state.emailsToNotify +
"?subject=" + this.state.mname
+ "&body=Please, review: " + "\n" + this.state.mname + "\n" + "at " + emailBody
}>
<button style={button4TableStyleObject('#007a86', '#ebf5ff', '#ff3900 #ff3900')} >{'Notify Selected'} </button>
</a>
However Outlook opens this email using a single line. Is there a way to make it multi-line? I used "\n" with double quotes but no luck.
You have to encode the parameters you pass in a mailto: url. For a line break, you can use %0A:
your message here
In order to not have to do this manually, you can use encodeURIComponent():
console.log(encodeURIComponent(`first line
second line
paragraph`));
NOTE: My knowledge of programming is scant.
I've got this line of code somewhere:
var item = "<h3>" + '' + postTitle + " </h3> <p>" + postContent + "</p>";
postUrl , postTitle and PostContent have previously been declared.
I'd like to wrap it all up inside a <div> tag that has some class or id assigned to it, as in...
var item = "<div id="special"> <h3>" + '' + postTitle + " </h3> <p>" + postContent + "</p> </div>";
But that doesn't seem to work.
Is it because of the quotations getting messed up or is it the wrong way to go altogether?
You have two options:
Escaping the " quotes inside your string literal, like this: "<div id=\"special\"> <h3>"
Or using single quotes ' for either the outer string or inner one (you have the choice), like this: '<div id="special"> <h3>' or "<div id='special'> <h3>"
I personally prefer '<div id="special"> <h3>' because the generated HTML will contain the " quotes (which is the HTML standard) while keeping the JavaScript more readable and maintainable (compared to using escaped quotes)
I have the following Problem:
I'm trying to build a simple string like that:
for(var x in classicde) {
specificWines += "<li><a onClick='displayWine(" + "'GV'" + ")'>" + classicde[x] + "</a></li>";
}
Then I insert this string in the DOM structure with:
var list = document.getElementById("leftmenu-list");
list.innerHTML = specificWines;
The result is the following(something like that i have shortened it):
<ul id="leftmenu-list">
<li><a onclick="displayWine(" gv')'>Classic1</a></li>
</ul>
So there is a problem within the onclick event and i am not able to find the issue.
Your quotes are wrong around 'displayWine(" + "'GV'" + ")' it should be 'displayWine(" + "\"GV\"" + ")' so the single quotes contains double quotes and do not break the attribute on render. \ is used to escape the quote so it doesn't break the JS code.
for(var x in classicde) {
specificWines += "<li><a onClick='displayWine(" + "\"GV\"" + ")'>" + classicde[x] + "</a></li>";
}
Otherwise as you see you end up with the single quote breaking the attribute. If you pass a string inside a string you need to make sure you use different quotes.
This should now render as
<li><a onclick='displayWine("gv")'>Classic1</a></li>
I'm not good in JS. I tried to modify a jQuery plugin from these codes:
aTag += " style='"+innerStyle+"'";
aTag += arrow + '<span>text here</span>';
to these codes:
//aTag += " style='"+innerStyle+"'";
aTag += arrow + '<span style="'+innerStyle+'">text here</span>';
Basically I want to move the content of innerStyle from anchor tag to span tag. However, in Firebug I saw this mess after the move:
<span blue;"="" solid="" 1px="" border:="" 25px;="" text-indent:="" transparent;="" -80px="" 5px="" scroll="" no-repeat="" image.png")="" images="" web="" 127.0.0.1="" http:="" style="background: url(">text</span>
Why it works in anchor tag but not in span tag? What's the use of plus (+) signs?
+ does just what it looks like it does in this case (concatenate text). The issue here is that the HTML that is being generated in the first instance looks like this:
style='some contents with a " symbol'
while in the second case what is being generated is this:
style="some contents with a " symbol"
... which, as you can see, is broken - change your code to:
aTag += arrow + "<span style='" + innerStyle + "'>text here</span>";
and it will work.
I'm trying to get some notifications working for AJAXChat. To do this all I want to do is get the title of the page to blink until focused. To do this I'm using the jquery-titlealert plugin. The problem is the html that is generated for the onload event is generated inside a js file shown here
return '<div id="'
+ this.getMessageDocumentID(messageID)
+ '" class="'
+ rowClass
+ '">'
+ this.getDeletionLink(messageID, userID, userRole, channelID)
+ dateTime
+ '<span class="'
+ userClass
+ '"'
+ this.getChatListUserNameTitle(userID, userName, userRole, ip)
+ ' dir="'
+ this.baseDirection
+ '" onload="$.titleAlert('New Message');">'
+ userName
+ '</span>'
+ colon
+ this.replaceText(messageText)
+ '</div>';
return
When I use this, it breaks the page. If I replace ('New Message') with (New Message) the page loads again but the notification isn't working. I think this is because its displaying a Javascript function inside Javascript. Anyone see anything here I'm missing?
Have you tried escaping your quotes? I.e.:
+ '" onload="$.titleAlert(\'New Message\');">'
Any single quote (') inside a single quoted string (or double quote (") inside a double quoted string) needs a backslash (\) before it. See the MDN String Literals documentation for more information about strings and proper character escaping.
You need to escape the quotes.
Change this
'" onload="$.titleAlert('New Message');">'
to this
'" onload="$.titleAlert(\'New Message\');">'
Try escaping the apostraphe's correctly:
+ '" onload="$.titleAlert(\'New Message\');">'