2013-03-02 2 views
9

Я пытаюсь сделать работу функции javascript при нажатии кнопки поиска, но функция, похоже, не работает. Пожалуйста, направляйте. Fiddle.onclick не работает с кнопкой

<form action="" method="get" id="searchform" > 
    <input name="q" type="text" id="search" size="32" maxlength="128" class="txt"/> 
    <input type="submit" id="hit" value="Search" onclick="myFunction()" class="btn"/> 
</form> 

Херес JS,

function myFunction() { 
alert("I am an alert box!"); 
} 
+0

Попробуйте 'OnClick = "MYFUNCTION(), возвращение ложным"' но это остановит вашу форму работать. – Oliver

+0

Как сказал oliver, если вы выполните 'return false ', ваш JS должен выполнить, но это предотвратит продолжение представления, поэтому ваша форма не будет отправлена. –

+0

Должно ли не обработчик работать в любом случае, а затем отправить форму? –

ответ

8

Вы обернули функцию в корпусе, onLoad, просто замените его на отсутствие обертывания - в <head>. См. this скрипка.

function myFunction() { 
    alert("I am an alert box!"); 
} 

}; 
^^ 

У вас также есть в вашем коде дополнительные };,

UPDATE:

Это происходит потому, что:

  • если функция место внутри $(document).ready, то может быть только , используемый в готовом обратном вызове (и во внутренних объектах). Вы не можете ссылаться на него снаружи.

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

+0

Не могли бы вы объяснить разницу между ними? –

+0

попробуйте сделать эту функцию выше в $ (документе).ready() из js, он не будет выполнен, но если вы разместите его за его пределами, он начнет стрелять ... – sourcecode

+0

, кроме того, если функция имеет внутреннее имя функции javascript (например: close()), то это не сработает. была ли эта проблема сегодня и поняла, что close() перезаписывается JS – juliusmh

3

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

Проверьте консоль ошибок браузера (F12 в IE и Chrome) и посмотрите, есть ли какие-либо ошибки, поскольку они перестанут определять функцию.

+0

Спасибо. Существует ошибка, указывающая, что myFunction не определен. –

3

Я посмотрел на вашу скрипку, у нее есть дополнительная закрытая скобка. Это должно сработать.

function myFunction() { 
    alert("I am an alert box!"); 
    return false; 
}; 

Ваш скрипку выглядел следующим образом:

function myFunction() { 
    alert("I am an alert box!"); 
    } 
}; 

EDIT 1: Я добавил return false, так как пользователь не хочет, чтобы отправить форму.

EDIT 2:

Поскольку никто не хочет объяснить этот вопрос JS скрипку, я возьму удар его.

В исходном JS Fiddle «onLoad» используется во втором выпадающем меню боковой панели.

Причина, по которой этот параметр не работает, заключается в том, что JS Fiddle выполняет javascript-код в функции onload. Это означает, что myFunction выходит за рамки.

Вот почему вам нужно использовать опции «Без обертывания» и «Без обертывания» в раскрывающемся меню. Используя эти два варианта, ваша функция myFunction будет находиться в глобальной области.

Я надеюсь, что это прояснит ситуацию.

Редактировать 3

Если вы действительно хотели использовать событие OnLoad. Вместо этого вы можете добавить обработчик события клика и удалить атрибут onclick в разметке кнопки отправки.

В целом, вероятно, лучше настроить обработчики событий с помощью javascript.

document.getElementById('hit').addEventListener('click', function() { 
    alert("I am an alert box!"); 
}); 

Если вы хотите использовать JQuery, вы можете сделать это:

$('#hit').click(function() { 
    alert("I am an alert box!"); 
}); 
6

следующие работы для меня:

 <form action="" method="get" id="searchform" > 
      <input name="q" type="text" id="search" size="32" maxlength="128" class="txt" > 
      <input type="submit" id="hit" value="Search" onclick="myFunction()" class="btn"> 
     </form> 
     <script> 
      function myFunction() { 
       alert("I am an alert box!"); 
      } 
     </script> 

, но я заметил, что у вас есть }; в конце вашего вопроса - может быть, это то, что вызывает синтаксическую ошибку?

UPDATE:

Проблема был (кроме };) с настройкой вашей стельки. Проверьте this вне!

+1

Ваш обновленный пример Fiddle работал для меня. Возможно, вы можете объяснить, какие настройки вы изменили и почему это сработало. Я понял это, но сначала не понял. – Gohn67

+0

@ Gohn67 Оформить заказ в левом меню вашего скрипача против моего. Легко видеть разницу в настройках. – alfasin

+0

Да, я знаю, в чем разница. Я уже поддержал ваш ответ. Я просто предлагал вам объяснить в своем ответе, чтобы будущие посетители и Фахад Уддин знали разницу. Благодарю. – Gohn67

0

Положите вашу функцию в try-catch блок ... должен работать

function myFunction() { 
    try {  
     alert("I am an alert box!"); 
     //enter code here 
     return false; 
    } 
    catch (err) { 
     txt = "There was an error on this page.\n\n"; 
     txt += "Error description: " + err.message + "\n\n"; 
     txt += "Click OK to continue.\n\n"; 
     alert(txt); 
    } 
} 
Смежные вопросы