Форум

Kolko · #1 (**permalink**) 05.08.2014, 20:20

Здравствуйте. Есть два значения name и name1. Как сделать чтобы в поле input вывелось name пробел name1? Просто сложить их вот так калькулятором не удалось

Где ошибка и почему?

function calculat() {
	
	var name2 = name + name1;
	
	document.getElementById("name + name1").value=v2;
};

<select onchange="changeSel(this);">
<option value='1'></option>
<option value="2">Mersedes</option>
 </select>

<select onchange="changeSel1(this);">
  <option value="1">S-Class</option>
  <option value="2">Sprinter</option>
  
</select>

</br>
</br>

<input type="text" name="" id="name2" value="">

<script type='text/javascript'>
function changeSel(el){
var v, n;
n=el.selectedIndex;
v=el[n].text;
document.getElementById("name").value=v;
};
function changeSel1(el){
var v1, n1;
n1=el.selectedIndex;
v1=el[n1].text;
document.getElementById("name1").value=v1;
};
</script>

Safort · #2 (**permalink**) 05.08.2014, 20:31

Чувааак, подучи JS, я запутался в логике кода, тут наркомания какая-то))

//сложение с пробелом
document.querySelector('#name2').value = name + ' ' + name1;

Kolko · #3 (**permalink**) 05.08.2014, 21:04

я понимаю, что я не грамотный в яваскрипте, но хочу разобраться как это работает)). За основу был взят код с какого-то сайта.
Я правильно понимаю, что document.querySelector нужно заносить в onclick поля?

Safort · #4 (**permalink**) 05.08.2014, 22:07

Kolko,
а тебе именно по клику надо?

Вот пример по клику:

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
<input type="text" id="my-id" onclick="calculat()">
</body>
<script>

  function calculat() {

    var name = 'значение';
    var name1 = 'значение1';

    document.querySelector('#my-id').value = name + ' ' + name1;

  }


</script>
</html>

Rise · #5 (**permalink**) 06.08.2014, 01:40

Kolko, заносите!

Kolko · #6 (**permalink**) 06.08.2014, 08:01

Сообщение от Safort

Kolko,
а тебе именно по клику надо?

да, т.е. когда выбрал значение из списка и нажал Mersedes и, например, Sprinter, то в my-id заносится Mersedes Sprinter и немедленно отображается в input.
Благодарю, что помогаете.
Но почему когда мы складываем функцией calculat значение name и name1 они не складываются? Их как будто не существует

Вот весь мой код:

<select onchange="changeSel(this);">
<option value='1'></option>
<option value="2">Mersedes</option>
 </select>

<select onchange="changeSel1(this);">
  <option value="1">S-Class</option>
  <option value="2">Sprinter</option>
  
</select>

</br>
</br>

<input type="text" id="my-id" onclick="calculat()">


<script type='text/javascript'>
function changeSel(el){
var v, n;
n=el.selectedIndex;
v=el[n].text;
document.getElementById("name").value=v;
};
function changeSel1(el){
var v1, n1;
n1=el.selectedIndex;
v1=el[n1].text;
document.getElementById("name1").value=v1;
};
function calculat() {
var name = 'name';
var name1 = 'name1';
document.querySelector('#my-id').value = name + ' ' + name1;
};
</script>

Safort · #7 (**permalink**) 06.08.2014, 12:00

Kolko,

Цитата:

Но почему когда мы складываем функцией calculat значение name и name1 они не складываются? Их как будто не существует

Проверил у себя этот код и как раз таки calculat это единственное, что работает.

А вот эта часть вообще не понятна для чего

document.getElementById("name").value=v;

Ведь у тебя нет элемента с id = name

Кароч, вот код:

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>

<select onchange="changeSel();">
  <option value="2">Mersedes</option>
  <option value='1'></option>
</select>
 
<select onchange="changeSel();">
  <option value="1">S-Class</option>
  <option value="2">Sprinter</option>
</select>
 
</br>
</br>
 
<input type="text" id="my-id" onclick="calculat()">

<script type='text/javascript'>

  function changeSel() {

    var selects = document.querySelectorAll('select');
    var el1 = selects[0].selectedIndex;
    var el2 = selects[1].selectedIndex;

    document.querySelector('#my-id').value = selects[0].options[el1].text +
                                             ' ' + 
                                             selects[1].options[el2].text;
  }

</script>
</body>
</html>

Rise · #8 (**permalink**) 06.08.2014, 12:24

Kolko, так еще можно:

<select id="marka" onchange="changeSel()">
	<option value="">----------</option>
	<option value="Mersedes">Mersedes</option>
</select>
<select id="model" onchange="changeSel()">
	<option value="">----------</option>
	<option value="S-Class">S-Class</option>
	<option value="Sprinter">Sprinter</option>
</select>
</br></br>
<input type="text" id="auto">

<script>
function changeSel() {
	if (marka.value) {
		auto.value = marka.value + ' ' + model.value;
	} else {
		model.selectedIndex = 0;
		auto.value = '';
	}
}
</script>

Kolko · #9 (**permalink**) 06.08.2014, 13:09

блин, это чертовски круто работает!!!

Safort, Rise,
респект!

Форум

Справочник

Discord чат

Курсы javascript