Как отобразить результат на той же странице? - PullRequest
Новая
       0

Как отобразить результат на той же странице?

0 голосов
/ 11 февраля 2020 

function selectFunction(letter){
		document.getElementById("select").innerHTML = "Selection is : " + letter;
	}
<html>
<head>
	<title>Event on list of elements</title>
</head>
<body>
<div id="select">
<form>
	<select onchange="selectFunction(this.value)">	
<option>A</option>
<option>B</option>
<option>C</option>
<option>D</option>
<option>E</option>
	</select>
</form>
	</div>
</body>
</html>

Я новичок в сценарии java, что мне нужно сделать, это то, что при нажатии на один из параметров результат находится на той же странице, и что каждый раз, когда я нажимаю на другую страницу письма, появляется новый результат Я понятия не имею, как это сделать. Я попытался сделать .innerHTML+=, но это показывает кучу результатов, и я хочу чистую страницу.

Ответы [ 2 ]

2 голосов
/ 11 февраля 2020

Не уверен, в чем проблема, потому что когда select div заполняется выбором букв, элемент select теряется?

Если это так, у вас может быть выделенный элемент для сохранить выбор: 

<div id="select">
    <div id="result">Selection will appear here</div>

    <form>
        <select onchange="selectFunction(this.value)">  
            <option>A</option>
            <option>B</option>
            <option>C</option>
            <option>D</option>
            <option>E</option>
        </select>
    </form>

    <script type="text/javascript">
        function selectFunction(letter){
            document.getElementById("result").innerHTML = "Selection is : " + letter;
        }
    </script>
</div>

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

<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
<option value="D">D</option>
<option value="E">E</option>

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

<option value="">Select letter:</option>
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
<option value="D">D</option>
<option value="E">E</option>
1 голос
/ 11 февраля 2020

Вы заменяете HTML вашего select div, вам нужно создать дочерний узел с вычисленным вами текстом, а затем добавить его к HTML из select div * 1003. *

Вот что вы должны сделать 

function selectFunction(letter){
  var node = document.createElement("div");
  var textnode = document.createTextNode("Selection is : " + letter);
  node.appendChild(textnode);                              // 
  document.getElementById("select").appendChild(node);
}
<html>
<head>
	<title>Event on list of elements</title>
</head>
<body>
<div id="select">
<form>
	<select onchange="selectFunction(this.value)">	
<option>A</option>
<option>B</option>
<option>C</option>
<option>D</option>
<option>E</option>
	</select>
</form>
	</div>
</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...