Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Помогите вынести js в отдельный скрипт (https://javascript.ru/forum/events/72158-pomogite-vynesti-js-v-otdelnyjj-skript.html)

pozitiv4ek 12.01.2018 14:58

Помогите вынести js в отдельный скрипт
 
Здравствуйте. Помогите, пожалуйста, вынести js код события onkeyup в отдельную фнкцию.
<input onkeyup="setCapitalLetter(this.value, this)" type="text">

Я с js на вы, но любому новичку, думаю, это по силам.

Nexus 12.01.2018 15:01

Цитата:

Сообщение от pozitiv4ek
вынести js код события onkeyup

Что сделать?

Объявить обработчик вне атрибута?

ksa 12.01.2018 15:04

Цитата:

Сообщение от pozitiv4ek
Помогите, пожалуйста, вынести js код события onkeyup в отдельную фнкцию.

Оно?

<input type="text" />
<script type='text/javascript'>
document.querySelector('input').addEventListener('keyup',function(){
	setCapitalLetter(this.value, this)
});
function setCapitalLetter(Val,Obj){
	alert(Val);
};
</script>

Dilettante_Pro 12.01.2018 15:11

наверное, так...
<input type="text" />
<script type='text/javascript'>
document.querySelector('input').addEventListener('keyup',function(){
	setCapitalLetter(this.value, this)
});
function setCapitalLetter(Val,Obj){
	Obj.value  = Val.toUpperCase() ;
};
</script>

pozitiv4ek 12.01.2018 18:30

ksa, не то, выскакивает окошко.

Dilettante_Pro, почти так. Только теперь все буквы становятся заглавными. А нужно только первую сделать заглавной.

Забыл указать обязательное условие. На сервер значение поля input должно отправляться именно с заглавной буквой. С помощью события onkeyup это работает. Но мне нужно вынести весь js код в отдельный файл.

Dilettante_Pro 12.01.2018 18:47

pozitiv4ek,
Цитата:

Сообщение от pozitiv4ek
нужно только первую сделать заглавной

<input type="text" />
<script type='text/javascript'>
document.querySelector('input').addEventListener('keyup',function(){
	setCapitalLetter(this.value, this)
});
function setCapitalLetter(Val,Obj){
	Obj.value  =  Val[0].toUpperCase() + Val.substr(1).toLowerCase() ;
};
</script>

Цитата:

Сообщение от pozitiv4ek
мне нужно вынести весь js код в отдельный файл

ну и выносите - в чем проблема?

Если будете подключать внешний скрипт в разделе head страницы, то js-код в файле нужно обернуть в
function ready() {
       // здесь ваш код
  }

  document.addEventListener("DOMContentLoaded", ready);

j0hnik 12.01.2018 19:02

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<input type="text">
	<script>
		document.querySelector('input').onkeyup=function(){
			this.value=this.value.replace(/^(.)/, el => el.toUpperCase()); 
		};
	</script>
</body>
</html>

j0hnik 12.01.2018 19:06

если для всех интутов
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<input type="text">
	<input type="text">
	<script>
		[].forEach.call(document.querySelectorAll('input'), el=>el.onkeyup=function(){
			this.value=this.value.replace(/^(.)/gm, el => el.toUpperCase()); 
		});
	</script>
</body>
</html>

pozitiv4ek 12.01.2018 20:11

Dilettante_Pro, j0hnik, спасибо! Оба варианта рабочие.
Вынес код в отдельный файл.

ksa 15.01.2018 10:48

Цитата:

Сообщение от pozitiv4ek
выскакивает окошко

Разумеется! Я же его вызываю...


Часовой пояс GMT +3, время: 01:56.