-1

我是 JavaScript 新手。这个请求看起来很简单，但似乎无法让它工作。

我想从下拉菜单中选择并返回 HTML 中的值。正如我现在所拥有的，它在文本框中返回值，但我希望它在不使用文本框的情况下编写它，只需将它返回到<p></p>.

http://jsfiddle.net/Ppk5k/

4

6 回答 6

1

<p>通过其 ID（或通过其他方法）获取，然后设置其innerHTML.

于 2012-04-08T21:45:59.473 回答
1

页面加载后不能使用 document.write，它将替换页面内容。您需要使用innerHTML 或appendChild。

于 2012-04-08T21:46:31.030 回答
1

干得好：

function favBrowser()
{
var mylist=document.getElementById("myList");
document.getElementById("favorite").innerHTML = mylist.options[mylist.selectedIndex].text+".";

}

您必须使用innerHTML将 HTML 设置为#favorite所选浏览器。

工作示例：http: //jsfiddle.net/Ppk5k/6/

更新

要获取值和文本：

function favBrowser() {
    var mylist = document.getElementById("myList");
    document.getElementById("favorite").innerHTML = mylist.options[mylist.selectedIndex].text;
    document.getElementById("favorite").innerHTML += " and the value of that option is " + mylist.options[mylist.selectedIndex].value + ".";
}

如果您选择 Google Chrome，它将输出：

您最喜欢的浏览器是 Google Chrome，该选项的值是 G。

例如：http: //jsfiddle.net/Ppk5k/13/

于 2012-04-08T21:50:12.423 回答
1

不要忘记value=""在选项标签中包含一个属性，例如：

<script type="text/javascript">
    function favBrowser() {
        var mylist=document.getElementById('myList');
        document.getElementById('favorite').value=mylist.value;
    }
</script>
<form>
    Select your favorite browser:
    <select id="myList" onchange="favBrowser()">
        <option></option>
        <option value="Google Chrome">Google Chrome</option>
        <option value="Firefox">Firefox</option>  
        <option value="Internet Explorer">Internet Explorer</option>
        <option value="Safari">Safari</option>
        <option value="Opera">Opera</option>
    </select>
    <p>Your favorite browser is: <input type="text" id="favorite" size="20" value=""></p>
</form>
于 2012-04-08T21:51:19.167 回答
1

执行此操作的最简单方法是为 HTML 元素赋予id属性并将其更改为 innerHTML 或 clear，创建文本节点并将其附加到元素：

内部HTML：

var element = document.getElementById('someElement');
element.innerHTML = "someValue";

附加孩子：

var element = document.getElementById('someElement');
var oldChild = element.firstChild;
element.removeChild(oldChild);

var newChild = document.createTextNode("someValue");
element.appendChild(newChild);
于 2012-04-08T21:51:51.730 回答
1

使用 innerHTML 。演示

HTML：

<form>
Select your favorite browser:
<select id="myList" onchange="favBrowser()">
  <option></option>
  <option>Google Chrome</option>
  <option>Firefox</option>  
  <option>Internet Explorer</option>
  <option>Safari</option>
  <option>Opera</option>
</select>
<p id="favorite">Your favorite browser is:
</p>

</form>

Javascript：

function favBrowser() {
    var mylist = document.getElementById("myList");
    document.getElementById("favorite").innerHTML= "Your favorite browser is: " +  mylist.options[mylist.selectedIndex].text;
}
于 2012-04-08T21:59:28.433 回答