Question

我不擅长编写脚本，抱歉：）

我有html / php项目。我发现javascript让我的项目很棒:)但是...脚本作业是当用户在“输入”字段中输入一些文本时，文本正在替换/发布到DIV中包含相同名称的另一个字段，如输入。这很好用。

<LABEL FOR='profile_name'>Profile name:</LABEL>
<INPUT TYPE='text' ID='$id' NAME='profile_name' CLASS='variable'></INPUT>

但我添加“select”字段有一些选项 - 做同样的事情就像输入 - 并且javascripts看起来工作正常，当我选择一些选项时，但只有当我按下“TAB”按钮，或者当我按下时选择“输入”按钮，选择文本在DIV字段上进行poulating。这是我的问题:(当用户输入内容时，“输入”字段在线“在线”正在替换DIV，但是“选择” - 否：（

请帮助，谢谢！这是我的问题:(

完整代码： https://jsfiddle.net/tubeto/wamc9b7u/2/

SELECT不工作：

<LABEL FOR='PBH'>value:</LABEL></TD>
<SELECT TYPE='text' ID='$id' NAME='PBH' CLASS='variable'>
<OPTION selected>[PHB]</OPTION>
<OPTION value='be'>0</a></OPTION>
<OPTION value='af2'>2</OPTION>
<OPTION value='af4'>4</OPTION>
<OPTION value='ef'>5</OPTION>
</SELECT>

Answer 1

不确定是否正确理解你的问题，但我会试一试您希望在<input>元素中重复<select>和<div>个值，对吗？

您的问题似乎与<select>元素有关。也许这是因为<select>比<input>更复杂。

<input>元素有一个值，但<select>元素包含选项，您必须获取所选<option>元素的值：

select.addEventListener('input', function() {
    selectOutput.innerHTML = select.options[select.selectedIndex].innerHTML;
});

以下是我理解的最小工作示例（请在提问时注意）：

＆＃13;

window.onload = function() {
  var input = document.getElementById('input');
  var select = document.getElementById('select');
  var labelOutput = document.getElementById('labelOutput');
  var selectOutput = document.getElementById('selectOutput');

  input.addEventListener('input', function() {
    labelOutput.innerHTML = input.value;
  });

  select.addEventListener('input', function() {
    selectOutput.innerHTML = select.options[select.selectedIndex].innerHTML;
  });
}

＆＃13;

<label for="profile_name">Profile name:</label>
<input type="text" id="input" name="profile_name">

<label for="PBH">value:</label>
<select id="select" name="PBH">
  <option selected="">[PHB]</option>
  <option value="be">0</option>
  <option value="af2">2</option>
  <option value="af4">4</option>
  <option value="ef">5</option>
</select>

<br>

<div>
  <span id="labelOutput"></span>
  <br>
  <span id="selectOutput"></span>
</div>

＆＃13;

将所选选项从html“select”发布到其他字段

1 个答案: