Apostrophes in jquery/javascript string - javascript

I have the following code which appends an icon with an alert after the <a> tag :
$j("li[name='"+node_name+"'] > a").after('<a onmouseover="alert(\' expnote_from_db[n][0] \');" ><ins class="' + selected_class + '"> </ins></a>');
The code above works fine except that it displays exp_from_db[n][0] as a string inside the alert box.
So I changed it to the code below but nothing is displayed now
$j("li[name='"+node_name+"'] > a").after('<a onmouseover="alert(\'"'+ expnote_from_db[n][0] + '"\');" ><ins class="' + selected_class + '"> </ins></a>');
I don't understand where did I go wrong with the apostrophes.
I would appreciate your help regarding this. Thanks

This should work
$j('li[name="'+node_name+'"] > a')
.after('<a onmouseover="alert(\''+ expnote_from_db[n][0] + '\')" ><ins class="' + selected_class + '"> </ins></a>');

The " characters are delimiting the HTML attribute. You are terminating that attribute prematurely.
<a onmouseover="alert(\'"
Nesting JavaScript in HTML attributes is a pain.
Nesting JavaScript in HTML attributes in JavaScript strings is a bigger pain.
Don't do it. Apply event handlers using addEventListener and friends (since you are using jQuery that means using the on method which abstracts them).

Related

Replacing apostrophe in string

I'm using phonegap to share an article via WhatsApp.
The code for the button is as follows:
shareArticle += '<li class="rrssb-whatsapp"><a href="javascript: void(1)" onclick="window.plugins.socialsharing.shareViaWhatsApp(\''+$('.article_title').html().replace(/'/g, "&apos;")+'\', null, \'http://www.myaddress.com/showArticle-'+articleId+'\', function() {console.log(\'share ok\')}, function(errormsg){alert(errormsg)});" class="popup" data-action="share/whatsapp/share">';
shareArticle += '<span class="rrssb-icon"><!-- Icon in SVG --></span>';
shareArticle += '</a></li>';
The part that I'm asking about is this:
onclick="window.plugins.socialsharing.shareViaWhatsApp(\''+$('.article_title').html().replace(/'/g, "&apos;")+'\', null, \'http://www.myaddress.com/showArticle-'+articleId+'\', function() {console.log(\'share ok\')}, function(errormsg){alert(errormsg)});"
The button is not working when there is an apostrophe in the title.
The strangest thing is that if I replace &apos; with " it work perfectly (even thought the result is wrong).
Doe's anybody has any idead why &apos; fails?
Thank you all for your support.
The solution is to change the apostrophe to another sign that doesn't break the string.
So what I did is:
$('.opinion_content_title').html().replace(/'/g, "′")
Again, thank you all.
The named character reference &apos; (the apostrophe, U+0027) was introduced in XML 1.0 but does not appear in HTML. Authors should therefore use ' instead of &apos; to work as expected in HTML 4 user agents.

JavaScript variable as HTML link text

I am trying to something like this:
JS variable
I have seen multiple threads where someone is trying to do something similar but none of these solutions seem to be working for me. I am trying to pull data from an API and I would like to use a variable from the API as the text for the link. Right now I am using jquery to do this:
$('#tracktitle').append($("<a href='" + track.permalink_url + "' target='_blank'>Title</a><br>").html(track.title));
but would like to have the 'html(track.title)' in place of 'Title'
any help would be greatly appreciated
What about?
$('#tracktitle').append("<a href='" + track.permalink_url + "' target='_blank'>" + track.title +"</a><br>")
When you create a new element with jQuery you can pass just the tag as the first argument to $() and then pass an object with the various properties you want to set as the second argument:
$("<a></a>", {
href : track.permalink_url,
html : track.title
}).appendTo("#tracktitle")
.after("<br>");
Demo: http://jsfiddle.net/7CVnZ/

Why are some of my link titles are being placed outside of my <a> tags?

Here is a jsbin so you can see what I mean.
As you can see some of my link titles are being placed outside the tags. Initially I thought this was to do with the fact some of the titles were surrounded by double quotes. I build a function to replace these but it had no effect.
After logging the title[i] before it is appended into the DOM, I can't see any reason why some would be placed inside the tags and some outside. If any one has any suggestions I would be very interested to hear them.
in postURLs function, change the line:
$("#" + subreddit + " > ul").append("<li>" + title[i] + "</li>");
to:
$("#" + subreddit + " > ul").append("<li><a href='" + url[i] + "'>" + title[i] + "</a></li>");
(just added single quotes to href attribute)
that will solve your problem.
next time, please include the code in the question body as well.
cheers.

window.document.write - write html element and more

I have opened a new window, and now I have a button in this new window. Under this button there is a JavaScript function which should submit the form and insert some content into a <p>. This "to-add" content also has a html element (close button).
This inserting job is not working. Here is what I tried:
myWindow.document.write("<scrip" + "t>function closeme(){ document.getElementById('danke').innerHTML='thanks <input type=\'button\' onclick=\'window.close()\'/>'; } </sc" + "ript>");
Can someone please help me out?
As said in the comments there are better ways to insert scripts, but in the interests of answering the question, you have to escape the escape characters as well so that they will be present in the output.
myWindow.document.write("<scrip" + "t>function closeme(){ " +
"document.getElementById('danke').innerHTML='thanks <input type=\\\'button\\\' " +
"onclick=\\\'window.close()\\\'/>'; } </sc" + "ript>");
(line breaks added for readability)
I agree there are better ways of doing this, but regarding your specific question. There are escaping issues:
myWindow.document.write("<scrip" + "t>function closeme(){ document.getElementById('danke').innerHTML='thanks <input type=\"button\" onclick=\"window.close()\" />'; } </sc" + "ript>");
I'd honestly add text/javascript for consistency.

JS Alert not showing when using Sharepoint list value

I am using Sharepoint 2007 and writing a web part. In the "RenderContents" method I am writing the html code for displaying page. there is a requirement to display alert message to user when they click a link.
I have written following code-
string alertmessage = Utility.GetLocalizedText("NavigatingToNewPageTxt", "RCCResources", "Common");
writer.Write("<a href='" + clubMemberReportsLink + "' target='new' onClick='alert('" + alertmessage + "');' > ");
Note- My requirement is to get the alert message from Sharepoint list as we use SP list for translations.
when I refreshed the site link was displayed but alert message did not appear.when I checked what was rendered in browser I got following code in browser.
ClubLeaderDownloadreportsText
I tried using following code as well
writer.Write("<a href='" + clubMemberReportsLink + "' target='new' onClick=alert('" + alertmessage + "'); > ");
(I removed the single quote from onclick method.)Still the browser does not display alert message.
this behavior is observed in both browsers. I know I am missing something very simple here...
can you pleas point out any help?
Seems like you need to escape the quotation marks for so that the onclick string is not terminated. Like:
onclick='alert(\"" + alertmessage + "\");'
Hope that helps!

Categories