У меня возникли некоторые функциональные проблемы с ежедневником. Я хочу дважды щелкнуть, чтобы добавить информацию в области данных. И я хочу, чтобы кнопка сохранения сохраняла эти текстовые данные.
Я могу консоль записывать в журнал нажатие кнопки сохранения и выводить соответствующий вывод «9 утра» по нажатию кнопки.
У меня просто отключение, как заставить это работать. Спасибо за помощь.
//current date and time
$("#currentDay").text(moment().format('ddd, MMM Do'));
//todo project
// Use window.localStoirage to retreve and store your data object as string
const LS = JSON.parse(localStorage.scheduler || '{}'); // now an Object
// double click makes calender content editable
$(".textData").dblclick(function () {
$(this).addClass('d-none')
$(this).siblings("input").removeClass("d-none");
});
$(".btn").dblclick(function () {
console.log(this);
console.log($(this).attr("id"))
var id = $(this).attr("id")
var time = id.slice(0,3)
console.log(time)
var timeInputId = time + "Input";
});
// save makes edit end
// set active time
// make background color of / past hours gray / current hour red / future hours green
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<link
rel="stylesheet"
href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
/>
<link
rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.8.1/css/all.css"
integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf"
crossorigin="anonymous"
/>
<link
href="https://fonts.googleapis.com/css?family=Open+Sans&display=swap"
rel="stylesheet"
/>
<link rel="stylesheet" href="style.css" />
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<title>Work Day Scheduler</title>
</head>
<body>
<header class="jumbotron">
<h1 class="display-3">Work Day Scheduler</h1>
<p class="lead">A simple calendar app for scheduling your work day</p>
<p id="currentDay" class="lead"></p>
</header>
<div class="container">
<!-- Timeblocks go here -->
<div class="row">
<div class='col-2 hour'> 9am
</div>
<div class="col-8 description red border-bottom scheduler">
<span class="textData 9amSpan">text here </span>
<input id="9amInput" class="d-none border-0 form-control textarea bg-transparent am9Input" type="text" placeholder="Default input">
</div>
<div class="col-2 saveBtn">
<button type="submit" id="9amButton" class="btn btn-primary mb-2 am9Button">Save</button>
</div>
</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>
<script src="script.js"></script>
</body>
</html>