Javascript not working in HTML5

Hi,

It seems the Javascript doesnt work in HTML5. Details as follows:

  1. HTML4
    In http://www.brilliant-storage.com.hk/QA.html , whenever you click a question, the corresponding answer will appear in the bottom.

  2. HTML5
    In http://www.self-storage-hk.com/test/storageQA.htm , whenever you click a question,the answer remains the answer to question 1.

The content of faq.js is the same in the above cases. They are:
function showdiv(id) {
var qaCount = $(“.qalist dt”).length;
for (var i = 0; i < qaCount; i++) {
if (i == id-1) {
if ($(“.qalist dd”).eq(i).is(“:visible”)) {
$(“.qalist dd”).eq(i).hide();
} else {
$(“.qalist dd”).eq(i).show();
}
} else {
$(“.qalist dd”).eq(i).hide();
}
}
}

function showQA(id) {
var qaCount = $(“.qalist dl”).length;
for (var i = 0; i < qaCount; i++) {
if (i == id) {
if ($(“.qalist dl”).eq(i).is(“:visible”)) {
$(“.qalist dl”).eq(i).hide();
} else {
$(“.qalist dl”).eq(i).show();
}
} else {
$(“.qalist dl”).eq(i).hide();
}
}
}

I cant figure out where is the problem. Can someone kindly give me an advice ?

Thanks in advance.

Regards,

Tony

The script calls on the $() function, which is usually a jQuery function. You have jQuery loaded on the page where it’s working, but you don’t have the jQuery library on the page where it’s not working. So the error message is "$ is not defined ".

Hi Ralph,

Thanks very much for the information.
As I dont have any knowledge in javascripts & jQuery, can you please tell me how can I have the jQuery loaded on the page where it’s not working.

Best Regards,

Tony

Hi Ralph,

Thanks for the information.
I search the internet & then inert the line:
<script src=“http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js”></script>
and problem fixed.

Best Regards,
Tony

If you don’t know JavaScript then why are you trying to use jQuery. You need an intermediate level knowledge of JavaScript to use jQuery properly.

Glad that helped, Tony.

Are you asking this of Tony, or of the 90+% of web designers out there? They are using jQuery because they don’t know JavaScript. :lol:

Bad advice !

If I works like you,I cant do anything.
Utilizing the knowledge provided in the internet & asking experts like Ralph in forums, I can almost finish writing my responsive website even I dont have any knowledge in HTML5,css,javascript & jQuery !!!

Thanks
Tony

As much as you may not like this reply I have to agree with felgall as you will eventually find yourself needing to code something that jQuery doesn’t do such as data management, of course this forum will be here to help but I would strongly recommend you visit coding tutorial websites that have videos as requesting help from others will only get you so far before you get stuck again.

I have seen lots of code people are having trouble with that consist of 20+ lines of JQuery calls where five or six lines of ordinary JavaScript would do the same thing and actually work.

I have also seen people asking how to do things with JQuery that are really basic JavaScript commands.

JQuery is an advanced piece of JavaScript code - you need to have a good knowledge of JavaScript in order to be able to use it.

Sure some people can get some things to work in JQuery without knowing JavaScript just as some people manage to create web pages without knowing any HTML. It is all fine until something doesn’t work and then they don’t know enough to fix it plus their code is such a mess that to fix it properly will require a complete rewrite. By all means use these tools without having learnt the basics but expect that when you ask for help when something doesn’t work that the responses you get are to rewrite it properly - since most of the problems these people have can’t happen if the code is written properly.

If you can’t get your JQuery to work and you don’t know JavaScript then the first step to fix your problem is to learn JavaScript.

Just to make it a bit clearer for the web designers I’ll use a corresponding example.

I know red from blue from green so I can create web pages that use colours. The web pages don’t quite liik right somehow because the colours seem to clash. Can one of you wseb designers who believe in using tools without having to learn the basics first please provide me with all the necessary alterations to the colours to get them to work together properly. I want to be able to use colours on my page without having to learn anything about colour theory (or whatever that web designer stuff is called).

Now web designers - what would your response to such a query be? Unless your response would be to spend time doing all the work fixing the colours so that the person posting the question doesn’t have to learn web design then don’t expect a web developer to fix your script for you rather than telling you to learn the basics (in this case JavaScript) first. (Oh and if you really do think that people should be able to use JQuery without knowing JavaScript and then get someone to fix it for them free of charge when it doesn’t work then please take a look at my JavaScript web site and write a new stylesheet for me to fix the colours and layout).

Touché! :wink:

JQuery is often marketed as a quick way to build dynamic elements in your website, even if you aren’t a JS developer to begin with. Many designers skip over raw JS because JQuery (and JQuery UI) comes pre-packaged with most of the common functionality you see on modern websites / web apps. It’s a shortcut for a lot of people because it’s simpler. The same way Bootstrap is often a shortcut for developers who don’t want to work their way through CSS and responsive design, and would rather let a framework do it for them. Same things goes for Wordpress and PHP. I can crank out a dozen sites using Wordpress without knowing any PHP at all. In a sense, JQuery gives designers that same kind of “copy + paste” development ability that Wordpress does.

They’re lose examples, but it’s the nature of the industry. More and more people are being asked to overlap between disciplines, and the quickest way to turn out a product is to use something that gives you a leg up. Is it the right way to do things? Not necessarily, but as someone who started in JQuery before I back-tracked into raw JS, I can certainly say that sometimes the cart needs to come before the horse.

Overall, I do agree with you that in an ideal scenario, people ought to learn JS before JQuery. However, it’s just not feasible for everyone.

Note: Sorry if this reads poorly. Running low on coffee this morning.

There is nothing wrong with a web designer using JQuery as a quick way to add some functionality as long as they realise that it is not necessarily going to be the most efficient way to achieve the result and that if what they have doesn’t work that they are likely to have to learn JavaScript to be able to fix it properly. That’s just like a web developer throwing together some CSS and images that kind of work for their site but which are nowhere near as effective or efficient as could be produced by a web designer.

I have seen lots of situations where someone asks how to fix 20 lines of JQuery calls that are intended to do what could be done in 5 or 6 ordinary JavaScript statements without JQuery. Obviously in those situations the answer is to completely redo the code. I’ve also seen lots of cases where someone asks for help with 5 or 6 lines of JQuery calls where 20 l;ines of ordinary could do the same thing. Unless Jquery is being used elsewhere in the page that is another situation where it is better to scrap the JQuery and start over. JQuery is a JavaScript library - it is not intended to replace ordinary JavaScript commands and trying to use it that way will therefore not work.

As felgall says :

‘Efficient’ is subjective in this instance. If you know some JQuery but are unfamiliar with vanilla JS and need to add some quick functionality to a site, then adding JQuery in place of vanilla is likely to be the most efficient way to achieve the desired result. You’re weighing the value of reduced code against the time needed to learn the method of how to implement said code. Tens, perhaps hundreds of minutes of learning something new all to save yourself a few milliseconds of page load time.

More often than not, heavy JQuery users are going to learn some vanilla JS along the way. It’s a common ‘side effect’ of JQuery development. While JQuery might not be ‘JavaScript’ in the truest sense, it doesn’t mean that using it is wrong or that there ought to be some sort of “You need to know X amount of vanilla to ride” sign tacked on the entry gate.