2017-04-21 2 views
0

入力ボックスの値をマイセレクションに渡すボタンがあります。問題は、私の入力ボックスの値が私の選択した値が空でないことがないことです。 しかし、空であるか、指定された値を表示し、アスタリスクを付けると、他の人に表示したいと思います。じゃがいも* 。ONCLICK:アスタリスクで他のものや値を入力しない場合の値を確認する

<!DOCTYPE html> 
<html> 
<head> 
    <title></title> 
</head> 
<body> 
<input type="text" name="fruitname" id="fruitname" placeholder="Fruit Name"></input> 
<button name="findfruit" id="findfruit" onclick="findfruit()">Find Fruit in Select</button> 
<select name="fruitcontainer" id="fruitcontainer"> 
    <option value="Apple">Apple</option> 
    <option value="Banana">Banana</option> 
    <option value="Coconut">Coconut</option> 
    <option value="Durian">Durian</option> 
    <option value="Others">Others</option> 
</select> 

</body> 
</html> 
<script type="text/javascript"> 
    function findfruit(){ 
     document.getElementById('fruitcontainer').value = document.getElementById('fruitname').value; 
    } 
</script> 
+0

あなたが値を入力するのであれば選択は、あなたが入力* +入力した値を持つようにしたいていないこと? – trevster344

+0

ええええええええ、@ trevster344 –

答えて

0

テストテキスト入力<select>の可能な値の1つが。

function findfruit() { 
 
    var value = document.getElementById('fruitname').value; 
 
    if (value == '') { 
 
    value = "Others"; 
 
    } else if (!document.querySelector("#fruitcontainer option[value='" + value + "']")) { 
 
    value += '*'; 
 
    var newOption = document.createElement('option'); 
 
    newOption.value = value; 
 
    newOption.textContent = value; 
 
    document.getElementById('fruitcontainer').appendChild(newOption); 
 
    } 
 
    document.getElementById('fruitcontainer').value = value; 
 
}
<input type="text" name="fruitname" id="fruitname" placeholder="Fruit Name"></input> 
 
<button name="findfruit" id="findfruit" onclick="findfruit()">Find Fruit in Select</button> 
 
<select name="fruitcontainer" id="fruitcontainer"> 
 
    <option value="Apple">Apple</option> 
 
    <option value="Banana">Banana</option> 
 
    <option value="Coconut">Coconut</option> 
 
    <option value="Durian">Durian</option> 
 
    <option value="Others">Others</option> 
 
</select>

+0

ありがとうございます。しかし、私は入力ボックスではなくselectでアスタリスクを使用してその値を必要とします。 –

+0

選択に新しいオプションを追加したいですか? – Barmar

+0

はいsir @Barmarたとえば、入力ボックスにPOTATOを置くと、selectの値はPOTATO *になります。 –

関連する問題