简体   繁体   English

<button>进入</button><option value="for paragraph change"><button>用于段落更改</button></option>

[英]<button> in to <option> for paragraph change

I have written the code you will see below but i would like to have a drop down menu like this ```我已经编写了您将在下面看到的代码,但我想要一个像这样的下拉菜单```

    <option value="sel">Select Paragraph</option>
    <option value="par1">Paragraph 1</option>
    <option value="par2">Paragraph 2</option>
    <option value="par3">Paragraph 3</option>
    </select> ``` 

I have tried using on click inside the but it didn't work, any help would be greatly appreciated.我已经尝试在里面使用点击,但它没有用,任何帮助将不胜感激。

<html>
<body>
</head>


<div class="topnav">
    <button onclick="myFunction()">change text on 1st paragraph</button>
    <button onclick="myFunction2()">change text on 2nd paragraph</button>
    <button onclick="myFunction3()">change text on 3rd paragraph</button>
    
</div>

<h1>1st Exercise</h1>



<p id="1">1st paragraph/p>

<p id="2">2nd paragraph/p>

<p id="3">3rd paragraph</p>

<script>
function myFunction() {
    var person = prompt("Please enter your text");
  document.getElementById("1").innerHTML = person;
}

function myFunction2() {
    var person2= prompt("Please enter your text");
  document.getElementById("2").innerHTML = person2;
}

function myFunction3() {
  var person3 = prompt("Please enter your text");
  document.getElementById("3").innerHTML = person3;
}
</script>
</body>
</html> ```

Onclick doesn't work with option as you though... Onclick 不适用于您的选项...

You need to use onchange on select , you're looking for .selectedIndex and .value properties.您需要在select上使用onchange ,您正在寻找.selectedIndex.value属性。

 <select onchange="document.getElementById(this.selectedIndex).innerHTML = this.value"> <option value="sel" >Select Paragraph</option> <option value="par1">Paragraph 1</option> <option value="par2">Paragraph 2</option> <option value="par3">Paragraph 3</option> </select> <p id="1">111</p> <p id="2">222</p> <p id="3">333</p>

Than you can change your paragraphs content as you need.您可以根据需要更改段落内容。 Basic example to change paragraph with option's value is in my code snippet.使用选项值更改段落的基本示例在我的代码片段中。

If you want just to select paragraph and set it's content from prompt dialog, it'd be如果您只想 select 段落并从prompt对话框设置它的内容,那就是

<select onchange="document.getElementById(this.selectedIndex).innerHTML = window.prompt()">

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM