jquery: вызов функции по имени при выборе изменения

Я пытаюсь вызвать функцию по имени .onchange выбора, но ничего не происходит. Когда функция описана после атрибута, она работает.

ЭТО НЕ РАБОТАЕТ

HTML-код:

<select id="numb">
  <option value="1">1</option>
  <option value="2">2</option>
</select>

сценарий:

<script type="text/javascript">
    $('#numb').change(testMessage);
</script>

<script type="text/javascript">
    function testMessage(){
        alert('Hello');
    }
</script>

ЭТО РАБОТАЕТ

HTML-код:

<select id="numb">
  <option value="1">1</option>
  <option value="2">2</option>
</select>

сценарий:

<script type="text/javascript">
    $('#numb').change(function(){
      alert('Hello')
    });
</script>

EDIT:

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

6 ответов


это потому, что обработчик testMessage не определяется при привязке к событию изменения.

он должен работать, если он был в том же контексте сценария, как показано ниже,

<script type="text/javascript">
    $('#numb').change(testMessage);

    function testMessage(){
        alert('Hello');
    }
</script>

код <script></script> выполняются один за другим прогрессивные сверху и testMessage функция не существует внутри первого <script></script>.

у вас есть несколько вариантов здесь,

  1. поместите его в анонимную функцию, которая позволит вашему скрипту разрешите позже. [Как предложено в Оптимус Прайм ответ]

    <script type="text/javascript">
      $('#numb').change(function () { 
         testMessage
      });
    </script>
    <script type="text/javascript">
       function testMessage(){
          alert('Hello');
       }
    </script>
    
  2. включить скрипт выше script что связывает testMessage как ниже

    <script type="text/javascript">
    function testMessage(){
        alert('Hello');
    }
    </script>
    <script type="text/javascript">
      $('#numb').change(testMessage);
    </script>
    

вместо того, чтобы попробовать ,

<script type="text/javascript">
    $('#numb').change(function(){
       testMessage();
    });
</script>

Рабочая Jsfiddle попробуйте это:

<script type="text/javascript">
    $('#numb').on('change',testMessage);
</script>

попробуйте это и поместите в тот же тег скрипта:

<script type="text/javascript">
    $(document).ready(function(){
        $('#numb').change(testMessage);

        function testMessage(){
            alert('Hello');
        }
    });
</script>

необходимо определить обратный вызов функции change.

<script type="text/javascript">
    $('#numb').change(function(){
        testMessage(); 
    );

    function testMessage(){
        alert('Hello');
    }
</script>

Это должно решить вашу проблему.


Я не думаю, что ваша ссылка существует еще для функции, вот два способа, которыми вы могли бы это сделать. Я поместил версию с пространством имен в качестве предложения, потому что это может помочь очистить ваш код в целом.

HTML:

<select id="numb">
  <option value="1">1</option>
  <option value="2">2</option>
</select>

сценарий:

// Namespaced и использование прокси

<script type="text/javascript">
    var project = project || {};
    project = {
        testMessage: function (event) {
           alert('Hello');
        }
    };

    $('#numb').change($.proxy(project.testMessage, project));
</script>

/ / только что объявлено

<script type="text/javascript">
    function testMessage(){
      alert('Hello');
    }

    $('#numb').change(function(event) {
       testMessage();
    });
</script>

Если ваш метод находится в другом файле, убедитесь, что вы включили этот файл перед файлом с привязкой события. Ты получаешь что-нибудь? ошибки в консоли?