JQuery - используя его в поле ввода - не может получить переменную из функции, поэтому я могу использовать его

0

В первый раз, когда я пытаюсь использовать свои уроки jQuery на реальной веб-странице, я обнаружил, что переменная guess (внутри области этой внутренней функции) исчезает, как только функция завершается.

Это, по-моему, нормальное поведение JavaScript, но как обычно можно захватить переменную, чтобы можно было использовать ее в других функциях? Мои уроки никогда не охватывали это.

Я предположил, что, как только guess была направлена внутрь innerHTML #display, он будет придерживаться. Но он даже исчезает оттуда.

?

<!DOCTYPE html>
<html>
    <HEAD>
        <title>Game of the Century</title>
        <meta charset="UTF-8">
        <LINK href="reset.css" rel="stylesheet" type="text/css">
        <LINK href="main.css" rel="stylesheet" type="text/css">
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
        <script type="text/javascript" src="application.js"></script>
    </HEAD>

    <body>
        <form>
            <input type='text' name = "input" id = "input"><br>
            <input type='submit' id="submit">
        </form>
        <p id = "display"></p>   
        <div>
            <img src="http://img707.imageshack.us/img707/2403/rj1a.jpg" alt = "ad">
        </div>
    </body>
</html>

...

$(document).ready(function () {

        $('#submit').click( function() { 
              var guess = $('#input').val();
              $("#display").html(guess);
         });   

});
  • 3
    Можете ли вы добавить свой HTML? Кроме того, если вы используете jQuery, зачем использовать document.getelementbyid?
  • 0
    Почему бы вам не объявить переменную вне области действия клика?
Теги:

2 ответа

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

Это абсолютно нормально и не связано с jQuery. Ваша переменная guess определяется в закрытии, анонимной функции. Таким образом, он живет там, и он недоступен вне этой области. Если вы хотите использовать guess вне обработчика кликов, просто определите его снаружи. Например:

$(document).ready(function () {
    var guess;
    $('#submit').click( function() { 
        guess = $('#input').val();
        $("#display").html(guess);
    });   
    var anotherMethod = function() {
        alert(guess); // <--- it works
    }
});

Кроме того, вам не нужно использовать document.getElementById если вы уже включили jQuery.

Изменение: я только что видел html. Существует еще один побочный эффект кода. Ваша форма фактически отправляется, когда вы нажимаете кнопку. Попробуйте изменить type="submit" на "type="button" или каким-либо другим способом предотвратить отправку формы.

  • 0
    К сожалению, у меня действительно была предопределенная переменная догадки, прежде чем я вставил свой код сюда. Это была «покорность», которая все испортила. Так что, имея только одно поле ввода, я, вероятно, вообще не нуждаюсь в разделе <form>? Подсказка, почему «submit» выбрасывает мои данные?
  • 0
    Что происходит, так это то, что форма отправляется, что означает, что страница перезагружается. Если вы тестируете на localhost, это происходит очень быстро.
Показать ещё 2 комментария
2

Просто здесь мое решение, возможно, лучшее разделение задач чтения/записи

    $(document).ready(function () {

        getMyHtml = function() {
            return $('#input').val();
        }

        setMyHtml = function () {
            var s = getMyHtml();
            $("#display").html(s);
        }

        $('#submit').click(setMyHtml);
    });   

Ещё вопросы

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