Я делаю игру Soduko в HTML и javascript. Я хочу, чтобы пользователь выбирал числа (0 - 9) вместо их ввода.
Вот пример для одного входа (ячейка 0: 0):
<td><input id="c00" type="text" size="1" onclick="validate()"/></td>
Я хотел бы, чтобы код javascript отображал опцию 0-9, когда эта ячейка нажата.
Моя идея такова.
if oncliked()
then display menu
document.getElementById("c00").value = selected value.
Вы должны использовать классы вместо идентификаторов для вашего события click, например:
<td><input class="number-select" type="text" id="c00" size="1"/></td>
Затем вы можете связать их со всеми из них в jQuery:
$("input.number-select").click(function(){
$("#tile-chooser").show();
...
}
Внутри этого обратного вызова вы можете использовать
$(this).val()
для получения или установки значения текстового поля.
Также при click
вы должны показать свой селектор чисел. Вы можете сделать это, создав div с атрибутом data-input-id
где вы будете хранить id
текстового поля для заполнения.
Затем в этом div
вы можете создать 10 divs
с цифрами на них и специальный класс, например, digit-tile
и прикрепить к ним обратный вызов:
$("div.digit-tile").click(function() {
var inputId = $(this).parent().data("input-id");
$("#" + inputId).val($(this).data("value"));
$(this).parent().hide();
}
Ваши плитки могут выглядеть так:
<div id="tile-chooser" style="display:none">
<div class="digit-tile" data-value="1">1</div>
...
</div>
Добавьте CSS для этого, чтобы хорошо выглядеть, и он должен работать.
Последнее, что вам нужно добавить, это позиционирование div с черепицей, поэтому оно будет близко к текстовому поле, но это выходит за рамки этого вопроса, я думаю.
select
вместоinput
?