從文本中獲取HTML輸入並在Javascript中下拉菜單？

Question

我想為用戶提供兩種輸入機制-使用元素的文本輸入和下拉菜單。 輸入值是在javascript中獲取的。 （不使用PHP）。

我可以使每種方法都起作用，但不能同時起作用。

這可能是一個基本問題，但是有人可以解釋一下我需要如何設置事件處理程序以及每個輸入的值才能使這項工作有效？

<form name="myform"  onsubmit="return userInput()">
    <select id="myVal" onchange="userInput()" onsubmit="return userInput()">
        <option>Select a country</option>   
        <option value="All Countries">All Countries </option>
        <option value="Austrailia">Austrailia</option>
        <option value="Korea">Korea </option>
        <option value="Austria">Austria </option>
        <option value="United States of America">United States of America    
        </option>
        <option value="Japan">Japan</option>
        <option value="Canada">Canada </option>
        <option value="India">India</option>
    </select>


         <!-- <input name="Submit"  type="submit" value="Add to list" > -->
        <input type="text" id="myVal" placeholder="Add some text&hellip;">

 </form>

// Javascript code where I fetch user input.

   function userInput(event){
               userinput = document.getElementById("myVal").value
             //  console.log(userinput)
                // console.log(document.getElementById("myVal").value)
            //draw(document.getElementById("myVal").value)
           d3.select('svg').remove();
            main();
            console.log("Main has been called")
            // draw(document.getElementById("myVal").value)
            return false;
        }

Answer 1

您的選擇元素和文本輸入元素都具有相同的ID。 使它們唯一，並對JS中的每個元素進行一次調用。 另外，請除去select元素中的onsubmit事件處理程序屬性。