Jquery Help
I am brand new to JQuery and am trying to help my daughter troubleshoot an assignment that is due tomorrow. She is trying to do a simple To Do List. She followed a video instruction on line and the video says to use .on(click, ), but everything else I am reading shows to use .click.
Here is the HTML that she did based on the video:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Test</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="scripts.js"></script>
</head>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Test</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="scripts.js"></script>
</head>
<body>
<h1>To Do - Today</h1>
<hr />
<ul id="todolist">
<li><input type="checkbox" class="done" /> Sample 1 <button class="delete">Delete</button></li>
<li><input type="checkbox" class="done" /> Sample 1 <button class="delete">Delete</button></li>
</ul>
<h1>To Do - Today</h1>
<hr />
<ul id="todolist">
<li><input type="checkbox" class="done" /> Sample 1 <button class="delete">Delete</button></li>
<li><input type="checkbox" class="done" /> Sample 1 <button class="delete">Delete</button></li>
</ul>
<input type="text" id="newtext"> <button id="add">Add</button>
</body>
</html>
</body>
</html>
Here is the code that she did based on the video:
function addListItem() {
var text = $("#newtext").val();
$("#todolist").append('<li> <input type="checkbox" class="done" />'+text+'<button class="delete">Delete</button></li>');
$("#newtext").val('');
}
var text = $("#newtext").val();
$("#todolist").append('<li> <input type="checkbox" class="done" />'+text+'<button class="delete">Delete</button></li>');
$("#newtext").val('');
}
function deleteItem() {
$(this).parent().remove();
}
$(this).parent().remove();
}
function finishItem() {
if ($(this).parent().css('textDecoration') == 'line-through') (
$(this).parent().css('textDecoration', 'none');
} else {
$(this).parent().css('textDecoration', 'line-through')
}}
if ($(this).parent().css('textDecoration') == 'line-through') (
$(this).parent().css('textDecoration', 'none');
} else {
$(this).parent().css('textDecoration', 'line-through')
}}
$(function() {
$("#add").on('click', addListItem);
$(document).on('click', '.delete', deleteItem);
$(document).on('click', '.done', finishItem);
});
$(document).on('click', '.done', finishItem);
});
None of the commands are working. I have two questions.
1) Does it matter whether she uses the .on(click, ) method or the .click method?
2) Why is this code not working...does anybody see what the problem is?
3) Does a script.js file have to have the $(document).ready( function() { at the start of the file to run? I noticed it is not in the .on(click, ) document?
Thank you very much for your help!
Access your files securely from anywhere
Zoho Developer Community
New to Zoho LandingPage?
Zoho LandingPage Resources
New to Zoho Survey?
New to Zoho CRM Plus?
Deliver unforgettable customer experiences
New to Zoho CRM Plus?
Deliver unforgettable customer experiences
New to Zoho Marketing Plus?
Everything you need to run your marketing
New to Zoho Marketing Plus?
Everything you need to run your marketing
New to Bigin?
Topic Participants
maka4ever
Sticky Posts
My Zoho Story #19 - How and IT service provider, CTSP, are streamlining customer support using Zoho
My Zoho Story is a video podcast series where we connect with Zoho users worldwide to hear from them about their experiences with Zoho and how it became an integral part of their everyday business life. Our recent 'My Zoho Story' took us to AustraliaMy Zoho Story #18- How Mirage Visual Limited achieved enhanced customer service experience, using Zoho
My Zoho Story is a video podcast series where we connect with Zoho users worldwide to hear from them about their experiences with Zoho and how it became an integral part of their everyday business life. Our recent interview with Sam Blenkiron from MirageMy Zoho Story #17 - How Superior Trucking Payroll Service scaled their business with Zoho
My Zoho Story is a video podcast series where we connect with Zoho users worldwide to hear from them about their experiences with Zoho and how it became an integral part of their everyday business life. In our recent episode, we had the opportunity toUpdate on the upcoming Zoho User Group meetups - Q1
Hey Zoho Community! How're you all doing? We have an important announcement about the Zoho User Group meetups this quarter - Owing to the looming threat of COVID - 19, we're recalling several of our ZUG meetups that can't be run locally and are pulling back our Zoho teams who have traveled for these events. We have also suspended Zoho meetups run by our local partners and user group leaders as we do not want any of our users to come in harm's way. For those of you who have not seen the email aboutEighth day of Christmas - Zoho Recruit
Check out the story behind our sixth day of Christmas post. The eighth day of the 12 days of Christmas relates to Zoho Recruit "On the eighth day of Christmas my true love sent to me: eight maids a milking, seven swans a swimming, six geese a laying, five golden rings, four calling birds, three french hens, two turtle-doves, and a partridge in a pear tree." The eight maids walking up with portfolios in their hands signifies Zoho Recruit's recruitment solutions built to provide diverse, end-to-end
New to Zoho TeamInbox?
Zoho TeamInbox Resources
Zoho DataPrep Resources
Zoho CRM Plus Resources
Zoho Books Resources
Zoho Subscriptions Resources
Zoho Projects Resources
Zoho Sprints Resources
Qntrl Resources
Zoho Creator Resources
Zoho Campaigns Resources
Zoho CRM Resources
Design. Discuss. Deliver.
Zoho Show Resources
Get Started. Write Away!
Writer is a powerful online word processor, designed for collaborative work.
Zoho CRM コンテンツ
-
オンラインヘルプ
-
Webセミナー
-
機能活用動画
-
よくある質問
-
Ebook
-
-
Zoho Campaigns
- Zoho サービスのWebセミナー