Update functions and variables to jQuery
This commit is contained in:
62
script.js
62
script.js
@@ -1,47 +1,55 @@
|
|||||||
let items = []
|
let items = []
|
||||||
let result = ""
|
let result = ""
|
||||||
let input = document.querySelector("#input");
|
let input = $('#input');
|
||||||
|
|
||||||
|
|
||||||
input.addEventListener('keyup', function (event) {
|
|
||||||
if (event.keyCode === 13) {
|
|
||||||
event.preventDefault();
|
|
||||||
document.querySelector("#add").click();
|
|
||||||
}
|
|
||||||
|
|
||||||
|
$(function () {
|
||||||
|
$('form').on('submit', function(e) {
|
||||||
|
e.preventDefault();
|
||||||
})
|
})
|
||||||
document.querySelector("#add").addEventListener('click', addItem);
|
})
|
||||||
document.querySelector("#submit").addEventListener('click', displayResult);
|
|
||||||
document.querySelector("#reset").addEventListener('click', reset);
|
$(input).on('keypress', function(e) {
|
||||||
|
if(e.which == 13) {
|
||||||
|
addItem();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#add').on('click', function(){
|
||||||
|
addItem()
|
||||||
|
})
|
||||||
|
|
||||||
|
$('#reset').on('click', function(){
|
||||||
|
window.location.reload();
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#submit').on('click', function(){
|
||||||
|
displayResult()
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
function addItem() {
|
function addItem() {
|
||||||
if (input.value.length < 1) {
|
if (input.val().length < 1) {
|
||||||
document.querySelector("#inputError").innerHTML = "Add an item please";
|
$('#inputError').html("Add an item please");
|
||||||
} else {
|
} else {
|
||||||
items.push(document.querySelector("#input").value)
|
items.push($(input).val());
|
||||||
let ul = document.querySelector("#itemlist");
|
let ul = $('#itemlist');
|
||||||
let li = document.createElement('li');
|
let li = document.createElement('li');
|
||||||
li.appendChild(document.createTextNode(input.value));
|
li.append($('#input').val());
|
||||||
ul.appendChild(li)
|
ul.append(li)
|
||||||
document.querySelector("#input").style.border = "2px solid black";
|
$('#input').css('border', '1px solid black');
|
||||||
document.querySelector("#input").value = '';
|
$('#input').val('');
|
||||||
document.querySelector("#inputError").innerHTML = "";
|
$('#inputError').html("")
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
function displayResult() {
|
function displayResult() {
|
||||||
if (items.length < 1) {
|
if (items.length < 1) {
|
||||||
document.querySelector("#result").innerHTML = "Error: Add atleast 1 item"
|
$('#result').html('Error: Add atleast 1 item')
|
||||||
document.querySelector("#input").style.border = "2px solid red"
|
$('#input').css('border', '2px solid red');
|
||||||
} else {
|
} else {
|
||||||
result = items[Math.floor(Math.random() * items.length)];
|
result = items[Math.floor(Math.random() * items.length)];
|
||||||
document.querySelector("#result").innerHTML = result
|
$('#result').html(result)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function reset() {
|
|
||||||
window.location.reload();
|
|
||||||
}
|
|
||||||
|
|||||||
Reference in New Issue
Block a user