Вставить кнопку с функцией?

0

Вот мой код:

function ayee() {
    confirm("Ready to play?");
    var age = prompt("How old are you?"),
    replacement = document.getElementById('container'),
    message;
    if (age >= 18) {
        message = "Let get started!" ;
    } else {
        message = "You're under 18? Be careful out there....";
    }
    replacement.innerHTML = message ;
}

То, что я хочу сделать, - это возврат, если возраст больше 18, добавьте кнопку вместе с сообщением (или содержащим сообщение), которое по клику отправит в следующую функцию.

PS: это для выбора собственной приключенческой игры.

  • 0
    И с какой именно проблемой вы сталкиваетесь?
  • 0
    Если я добавлю + <button etcetc .. /> либо к сообщению, либо к замещению .innerHTML = message (здесь); , все это не работает при первом нажатии кнопки. @Felix Феликс Клинг
Показать ещё 3 комментария
Теги:
dom

4 ответа

0
Лучший ответ

прикрепите кнопку вместе с отображаемым html и добавьте обработчик клика к кнопке с функцией, которую вы хотите вызвать при нажатии кнопки, например, простой код может выглядеть так:

function ayee() {
    confirm("Ready to play?");
    var age = prompt("How old are you?"),
    replacement = document.getElementById('container'),
    message;
    if (age >= 18) {
        //create a button
        var btn = "<input type='button' name='test' onclick='checkThis();' value='Click'>"; 
        //add the button to the message
        message = "Let get started!" + btn ;
    } else {
        message = "You're under 18? Be careful out there....";
    }
    replacement.innerHTML = message ;
}
function checkThis() {
    alert("Clicked the button");
}
Поделиться
  • 0
    Я бы ожидал большего от пользователя с большим количеством повторений, чем просто публикация блока кода.
  • 0
    Спасибо, это сработало отлично.
Показать ещё 2 комментария
1

попробуй это

replacement.innerHTML = message+"<button>Next</button>"
var s = replacement.getElementsByTagName("button")[0];
s.addEventListener("click",function() {alert("next");}) // change the function to
                                                        // suit your needs

Идея innerHTML создает DOM. Затем вы можете использовать обычную функцию JavaScript getElementsByTagName, чтобы получить кнопку внутри вашей замены

Затем добавьте прослушиватель событий нажатием кнопки, используя addEventListener

Это будет работать только на современных браузерах. Чтобы он работал в IE до IE9, пожалуйста, добавьте следующий код. См. Следующую ссылку для получения более подробной информации.

if(s.addEventListener)
     s.addEventListener("click",myFunction);
else if (s.attachEvent)
     s.attachEvent("click", myFunction);

играть на скрипке

Поделиться
0

Напишите свою функцию с некоторым параметром

function myfunction(message){
//do something with message
}

и измените message = "Let get started!" ; message = "Let get started!" ; к myfunction('Let get started!')

Поделиться
  • 0
    Я думаю, вы неправильно поняли вопрос. ОП хочет показать кнопку рядом с сообщением.
0

Сделайте что-то вроде этого:

var btn = document.createElement("button");
btn.value = "Begin";

if (age >= 18) {
    btn.addEventListener("click", function() {
        eighteen();
    });
}
else {
    btn.addEventListener("click", function() {
        notEighteen();
    }); 
}

container.appendChild(btn):

Вы также можете вызвать одну универсальную функцию, которая проверяет возраст и запускает два разных раздела кода вместо добавления прослушивателей событий для двух разных функций.

Просто примечание: когда вы объявляете переменную, вы должны поместить за ней "var". (var a = "test";)

Поделиться

Ещё вопросы

Сообщество Overcoder
Наверх
Меню