While following a tutorial , I see style sheet is not applied to clicked element in the list .What Could be the possible reason?The following sample works this way if some string is added to text box and then button is clicked, a new item gets added to list .If item in the list is clicked it should be stroked through.
<!DOCTYPE html>
<html lang="en" xmlns="http://ift.tt/lH0Osb">
<head>
<meta charset="utf-8" />
<title></title>
<script src="http://ift.tt/1HheyD3"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#taskText').keydown(function (evt) {
if (evt.keyCode == 13) {
addTask(this, evt);
}
});
$('#addTask').click(function (evt) {
addTask(document.getElementById('taskText'), evt);
});
// following statements not working
$('#tasks li').live('click', function(evt) {
$(this).addClass('done');
});});
function addTask(textBox, evt) {
evt.preventDefault();
var taskText = textBox.value;
$('<li>').text(taskText).appendTo('#tasks');
textBox.value = "";
};
</script>
<style type="text/css">
.done{
text-decoration:line-through;
}
</style>
</head>
<body>
<ul id="tasks">
</ul>
<input type="text" id="taskText" />
<input type="submit" id="addTask"/>
</body>
</html>
Aucun commentaire:
Enregistrer un commentaire