Wählen Sie den Wert ohne Taste

Ich habe eine Auswahl und ich muss validate für die ausgewählte ohne Onclick-Funktion festlegen. Also, wenn ich Healthcare gewählt habe, kann ich innerHTML eine Information im Absatz ohne Klicken auf die Schaltfläche.Wählen Sie den Wert ohne Taste

<select name="industry" id="industry"> 
    <option value="none"> </option> 
    <option value="1">Healthcare</option> 
    <option value="2">Mining</option> 
    <option value="3">Power</option> 
    <option value="4">Audit</option> 
    <option value="5">Accounting</option> 
    <option value="6">IT</option> 
    <option value="7">Telecommunications</option> 
    <option value="8">Justice</option> 
    <option value="9">Insurance</option> 
    <option value="10">International Organizations/Embassies</option> 
    <option value="100">Other</option> 
</select>

Quelle

2017-09-20 Anna

Hier Lösung in reinem Javascript:

var select = document.getElementById('industry'); 
 
var p = document.getElementById('paragraph') 
 

 
select.addEventListener('change',() => { 
 
    p.innerHTML = select.options[select.selectedIndex].value; 
 
})

<select name="industry" id="industry"> 
 
    <option value="none"> </option> 
 
    <option value="1">Healthcare</option> 
 
    <option value="2">Mining</option> 
 
    <option value="3">Power</option> 
 
    <option value="4">Audit</option> 
 
    <option value="5">Accounting</option> 
 
    <option value="6">IT</option> 
 
    <option value="7">Telecommunications</option> 
 
    <option value="8">Justice</option> 
 
    <option value="9">Insurance</option> 
 
    <option value="10">International Organizations/Embassies</option> 
 
    <option value="100">Other</option> 
 
</select> 
 

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

Quelle

2017-09-20 18:56:35

Versuchen jquery Ereignis und verwenden

<script> 
$(document).ready(function(){ 
    $("#industry").change(function(){ 
     //$("#paragraph_id").text("your text"); 
     // or $("#paragraph_id").append("your text"); 

    } 
}); 
</script>

Quelle

2017-09-20 18:48:05 clearshot66

ich nicht jquery wissen, dass gut, so dass ich nicht versuchen, es zu benutzen, andere, was ich in JS6 verwenden kann? – Anna

@Anna, Clearshot66 Lösung ist in Ordnung, aber es ist in jQuery geschrieben. Wenn Sie mit dieser Bibliothek nicht OK sind, habe ich Lösung in reinem Javascript hinzugefügt –

JQuery ist weniger Code für den gleichen Effekt. Sie müssen lediglich die Bibliothek importieren und auf Ihrer Seite ausführen. Aber reines JS6 wäre wie oben erwähnt. Nur weil du es nicht gut kannst, heißt das nicht, dass es nicht gut ist, es zu lernen und aufzuheben :) – clearshot66

Sie können auch schlicht js verwenden diese

zu tun

document.querySelector('select[name="industry"]').onchange=function(event){ 
    switch(event.target.value){ 
     case "1": 
      document.querySelector("#paragraph").innerHTML = "Information to display" 
    break; 
    default: 
      document.querySelector("#paragraph").innerHTML = "default message" 
    break; 
    } 
};

Quelle

2017-09-20 19:01:47

Sie können diese wie tun:

document.querySelector('#ice-cream').onchange = changeEventHandler; 
 

 
function changeEventHandler(event) { 
 
    const span = document.querySelector('#text');    
 
    if (!event.target.value) span.innerHTML = 'Please Select One';    
 
    else span.innerHTML = 'You like ' + event.target.value + ' ice cream.'; 
 
}

<label>Choose an ice cream flavor: 
 
    <select id="ice-cream" name="ice-cream"> 
 
        <option value="">Select One</option> 
 
        <option value="chocolate">Chocolate</option> 
 
        <option value="strawberry">Strawberry</option> 
 
        <option value="vanilla">Vanilla</option> 
 
    </select> 
 
</label> 
 
<br/> 
 
<br/> 
 
<span id="text"></span>

Quelle

2017-09-20 19:05:24

Wählen Sie den Wert ohne Taste

Antwort

Verwandte Themen