2015-11-18 3 views
0

У меня есть кнопка с событием onclick.Как связать событие onClick с файлом javascript?

Мое javascript для кнопки не в документе HTML, но я связал его с документом с <script src="example.js"></script>. Как связать событие «onclick» с моим файлом javascript? Это то, что я пробовал.

function pasuser(form) { 
    if (form.id.value=="user") { 
     if (form.pass.value=="password") {    
      location="example.html" 
     } else { 
      alert("Invalid Password") 
     } 
    } else { 
      alert("Invalid UserID") 
    } 
} 

<!DOCTYPE html> 
<html> 
    <head> 
     <title>NATUREBOWL- LOGIN</title> 
     <meta charset="utf-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
     <link rel="shortcut icon" href="favicon.ico"/> 

    <script src="loginform.js"></script> 

</head> 
<body> 
     <p>Log in to Conitinue</p> 
     <form name="login"><p>username </p><input name="id" type="text"> 
      <br/> 
     <p>password</p> 
     <input name="pass" type="password"> 
      <center> 
       <input type="button" value="Login" onClick="login.js"> 
      </center> 
</center> 
</div> 
</body> 
</html> 

PS-function pasuser(form) код login.js.

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

+0

Вы ошибаетесь в своем onclick. Он должен быть onclick = "pauser ('login');" –

ответ

0

Внешнего код связан с тегом <script src=""/> ведет себя точно так же, как код, который вы помещаете непосредственно в теги <script></script>. Поэтому относитесь к своей функции pasuser(form) так же, как если бы она была напрямую закодирована в HTML.

OnClick и другие свойства события хотят, чтобы код javascript внутри их кавычек, поэтому указание имени файла onClick="login.js" абсолютно неверно.Вы должны поместить внутри есть некоторый яваскрипт кода, который вызывает вашу функцию, передавая форму в качестве аргумента: onClick="pasuser(document.forms.login)"

Имейте в виде, однако, что ваш код имеет много недостатков и плохие вопросы дизайна:

  1. Nowdays, доступ к формы и элементы формы по имени - это немного старая практика.
  2. Наличие элемента с именем «id» может привести к двусмысленности внутри дерева DOM.
  3. Вы никогда не должны никогда иметь такую ​​проверку имени пользователя и пароля на клиентский код! Когда-либо!
+0

Спасибо! Я никогда об этом не думал, но это сработало! Кроме того, не беспокойтесь о безопасности кода. Я не буду использовать этот метод на реальном сайте. Я просто делал это как практику в java-скрипте :) –

0

Если вы импортируете свой .js-файл, на самом деле это как запись этого кода на самой странице. Просто вызовите имя функции в спецификации onclick.

0

Не устанавливайте OnClick на login.js, убедитесь, что .click значение установлено на имя функции, так что ваш OnClick должно быть

<input type="button" value="Login" onClick="pasuser(< put parameter here)"> 
0

Я предполагаю, что вы просто хотите OnClick к вызовите эту функцию.

<input type="button" value="Login" onClick="pasuser(<parameters>)"> 
0

Если я не ошибаюсь, OnClick требует функцию, которая будет выполняться. Просто ссылки на файл недостаточно, потому что ваш браузер не знает, что вы хотите, чтобы он запускал функцию. Попробуйте следующее:

<input type="button" value="Login" onClick="pasuser(form)"> 
0

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

<center> 
    <input type="button" value="Login" onClick="pasuser(form)"> 
</center> 
1

OnClick не может перенаправить вас на другой page.It не разработана таким образом. Все, что вам нужно сделать, это включить ваш .js-файл в раздел заголовка в документе html. Он будет включать страницу .js в текущий html-документ. Вы должны попросить нужную функцию, которая будет срабатывать при нажатии на кнопке

<head> 
    <script src="loginform.js"></script> 
</head> 

Тогда вы можете прикрепить любую функцию из этого .js файла вашего баттона OnClick envent

onClick="pasuser(//parameters);" 
Смежные вопросы