I have a javascript function that toggles the text of a button when clicked:
$(function() {
$(".trigger-block").hide();
$(".trigger").click(function() {
$(this).parents(".more-cases").find(".trigger-block").slideToggle();
$(this).toggleClass("close");
$(this).text($(this).text() == "その他の事例を見る" ? "その他の事例を閉じる" : "その他の事例を見る");
});
});
It works with English but it outputs squares with questions marks if I use Japanese.
I have charset=UTF-8 inside and also put it on the script tag with no success.
<script src="js/page.js" charset="UTF-8"></script>
Can some guide me to the solution? I've searched on various Japanese forums and haven't found an answer. I've had success using Japanese with .append so I don't know what is causing this problem.
EDIT: .append works on a different js file but not this one. I'm still trying to figure out what is different between those files.
Turns out the original file I was editing was not encoded properly. I've reached a solution by simply making a new .js file, and copying the original code to it. Thank you all for the support!
Related
So I've got this little piece of HTML that I have zero access to, and I need to change the URL of where it's linking, to somewhere else.
Now I've looked around, and I've tried different approaches and non seem to work so I must be doing something wrong.
the Html code:
<div class="manageable-content" data-container="edit_register_ind_container">
<a class="entry-text-link secondary-step step-button" id="register_ind_container" href="oldurl">Register</a>
</div>
First I wanted to try something that seemed easier, which was to change the displayed text "Register" to "Start a Fundraiser"
This is what I have got for that part:
// url manipulation
$(document).ready(function(){
$("#register_ind_container").click(function(){
$("#manageable-content a").text('Start a Fundraiser');
});
$("#register_ind_container").attr("href", "http://google.ca");
});
No luck so far for any of it.
a little background information:
I am using a platform called Luminate/Blackbaud, its a CMS with a weird set up. header tags and stuff like that go in a different place than the html body and the css is somewhere else as well (but I'm just using ftp to reference it in the header).
How I'm referencing the javascript code.
<script type="text/javascript" src="../mResonsive/js/urlmanipulation.js"></script>
My css works so I'm certain this should to, but I just don't know why it isn't.
All suggestions welcome (except for asking for the html access because I have, 3 weeks ago lol)
Thank you for your time!
I saw your both code :
$("#register_ind_container").attr("href", "http://google.ca");
This line will execute on page load so href should be changed on load
$("#register_ind_container").click(function(){
But when you performing this click on Id
it wont work because at that instance this id associated with an hyperlink
so hyperlink having the default subset rules
for Overriding this you can try
$("#register_ind_container").click(function(e){
// custom handling here
e.preventDefault();
$(this).text('Start a Fundraiser');
});
But this is also not a Good Practice. Hope this helps !
$(document).ready(function(){
$("#register_ind_container").click(function(){
$(this).text('Start a Fundraiser');
$(this).attr("href", "http://google.ca");
});
});
You are changing the URL outside the click event.. Wrap it inside the click event.. Also make use of $(this)
// url manipulation
$(document).ready(function(){
$("#register_ind_container").click(function(){
$(this).text('Start a Fundraiser').attr("href", "http://google.ca");
});
});
I need to replace and convert to URL following words on my entire site; Square-Technology UK. I've done some research into replacing text displayed within a site to replace it with url.
Here is the code:
http://jsfiddle.net/Hgtrh/1/
However it doesn't replace on my website for some reason. Here is the HTML am using.
<div class="main_testimonials">
<div class="c_box"></div>
<div class="main_content_img">
<img src="images/news/thumbs/1184901_10151885560986667_1371257993_n_t2.jpg" alt="News" class="news-category"></div>
<div class="main_bubble_box">
Thank you Square-Technology UK for my new system!!
</div>
</div>
this is an example of different javascipt that works, note the ' and "
echo "<script type='text/javascript'>
$(document).ready(function() {
$('body').removeClass('no-js'); $('#my-carousel-3').carousel({ itemsPerPage: 3, itemsPerTransition: 3, easing: 'swing', noOfRows: 1 }); });</script>\n";
Right managed to solve this very easily. My script didn't allow me to use double quotes inside the echo tag in PHP, which is quite obvious. Alternatively using single quotes does not work using the script I posted at the beginning. However the way to do it is just create another file.js, place the code inside it, and then attach it using the following:
echo"<script type='text/javascript' src='js/test_replace.js'></script>\n";
Did you try this?
$(document).ready(function() {
var thePage = $("body");
thePage.html(thePage.html().replace(/Square-Technology UK/ig, 'Square-Technology UK'));
})
Hope this helps..
Try using a more specific identifier to track what you want to replace instead of tracing the entire DOM to search for what you want to replace:
JS:
$(function() {
var $siteLink = $('.site-link'),
linkHtml = 'Square-Technology UK';
$siteLink.html(linkHtml);
});
HTML:
<span class="site-link"></span>
However since your fiddle seems to work we can only guess what is happening, can you provide more info about what jquery you are running, or how the page is layout.
Here is a Fiddle: http://jsfiddle.net/Hgtrh/4/
It is also worth mentioning just like ikaros45 said, that this is normally not something you would want to do with Javascript, this seems more like something that the templates should be able to deal with.
It works on your fiddler example, but not on your site. I suggest confirming that the JQuery library is loading on your site as expected.
So I managed to solve this very easily. My script didn't allow me to use double quotes inside the echo tag in PHP, which is quite obvious. Alternatively using single quotes does not work using the script I posted at the beginning. However the way to do it is just create another file.js, place the code inside it, and then attach it using the following:
echo"<script type='text/javascript' src='js/test_replace.js'></script>\n";
I have a ( probably very unclean) script that I intend to convert letters put into a text field into html image tags with corresponding pathways. I know there are probably easier ways of doing this, PHP for example however I am using it as a bit of an experiment to familiarise myself further with JS/Jquery. I have overcome a few obsticles to get where I am now as most of this is new ground for me.
In some cases the letters will have multiple images associated with them that will be selected at random so there are a couple of lines included which do this. These are fine however, the issue comes with the section of code that replaces the letters from the text field with the text and variables that make up the image tag. Whilst they work fine individually, when I want to convert multiple letters the replace overwrites instances of that letter in the previously generated image tag. Any ideas can I stop this? I've tried shifting the points at which the script occurs around but it seems the whole thing is somewhat fragile and haven't been able to create a workable solution.
Code in question:
// replace all instances within variable to generate thumbs
final_result = result.replace(/a/g, str_start+chosen_folder+"a"+random_variation+str_end)
.replace(/e/g, str_start+chosen_folder+"e"+random_variation+str_end);
JS Fiddle here: http://jsfiddle.net/N77wZ/
Many thanks in advance !
Do only a single replace:
final_result = result.replace(/a|e/g, str_start+chosen_folder+"$&"+random_variation+str_end);
I am trying to learn basic javascript and using jsfiddle as my tool of choice to play around with code. I've found I really learn through working examples I can see output for.
However, I find when I do something along the lines of the following, both lines are displayed on the same line:
document.writeln("This is Line One");
document.writeln("This is Line Two");
i.e. http://jsfiddle.net/u1sonderzug/NVSsy/
I understand as a beginner I might be going about doing this in the completely wrong way, so I'd like to understand best practices.
In html, <br> is for new lines.
document.writeln("This is Line One<br>");
This is not an issue of Javascript but an issue of HTML : println adds a carriage return at the end of the text but it has no effect in HTML because html doesn't take care of those characters. So you have to to :
writeln("....<br/>");
where is the html tag for carriage return;
OR
<pre>
writeln("...");
</pre>
*if your javascript is wrotten in the html page. Where is a balise to say to html he has to read every character including the carriage return added by writeln.
Anyway you should try to find tutorials for html and DOM, it's far more powerfull that this println and it's standard :)
I am trying to show some JS code in a textarea. The code is generated with JS so I am injecting it into the textarea with JS. However, using the <script> tags, causes the script to execute. I thought using < would solve this, but this is simply displaying < instead of <.
Any suggestions how I can do this?
$('myTextarea').set('value', '<script>alert('do something');</script>');
Just separate the script tag into two.
$('myTextarea').val('<script>alert("do something");</scr'+'ipt>');
The next </script> after the opening <script> block closes the script block; whether it's contained with a JS string or not.
To fix you can either split the </script> like so;
$('myTextarea').set('value', '<script>alert('do something');</scr' + 'ipt>');
Or like this (less common, but works, and probably more correct);
$('myTextarea').set('value', '<script>alert('do something');<\/script>');
Furthermore, you also need to fix your quotes;
$('myTextarea').set('value', '<script>alert(\'do something\');<\/script>');
You can see this now working here: http://jsfiddle.net/pK9SK/