如何在JavaScript中启用href

Question

I have a form, like this:

<form action="" method="get">

    <select>
        <option value="0">-</option>
        <option value="1">P1</option>
        <option value="2">P2</option>
        <option value="3">P3</option>
    </select>

    <a href="page6.html" onclick="return false;">New Page</a>   

</form> 

and I want to enable the href only if the option value is not "-". Can you help me, please?

Thanks,

Answer 1

What you want is to add an onChange event to the select, And then when the change function is called you can do a check to see whether you would like to change your page with this value, See code below for example

<form action="" method="get">
    <select onchange="getValue(this);">
        <option value="0">-</option>
        <option value="1">P1</option>
        <option value="2">P2</option>
        <option value="3">P3</option>
    </select>

</form>

<script>
    function onChange(sel){
        if(sel.value != "-"){
            document.location.href = newUrl;
        }

    }

</script>

Answer 2

It should look like this with the onChange event, +1 to david

<form action="" method="get">
                            <select id="sel" onchange="myFunction()">
                                    <option value="0">-</option>
                                    <option value="1">P1</option>
                                    <option value="2">P2</option>
                                    <option value="3">P3</option>
                            </select>
                <a  id="link">New Page</a>

then myFunction should look like this

if(document.getElementById("sel").value != "-"){
 document.getElementById("link").href = "your link here";
}
else{
 document.getElementById("link").href = "#";

}

Answer 3

Here is working code

$(function() {
  $("select").change(function() {
    if ($("select option:selected").val() != "0") {
      $("a").attr("onclick", "javascript:return true;")
    } else {
      $("a").attr("onclick", "javascript:return false;")
    }
  })
})

Here is JSFiddle code

Answer 4

Here is your code:

 checkSelect = function () { var mySelect = document.getElementById("mySelect"); return mySelect.options[mySelect.selectedIndex].text !== "-"; } 

 <form action="" method="get"> <select id="mySelect"> <option value="0">-</option> <option value="1">P1</option> <option value="2">P2</option> <option value="3">P3</option> </select> <a href="page6.html" onclick="return checkSelect();">New Page</a> </form> 

Answer 5

  function changeHref() { console.log(this.value) if (this.value == 0) { document.getElementById("anc").href=""; } else { document.getElementById("anc").href="page6.html"; } } var select = document.getElementById('sel'); select.addEventListener('change', changeHref, false); 

  <form action="" method="get"> <select id='sel'> <option value="0">-</option> <option value="1">P1</option> <option value="2">P2</option> <option value="3">P3</option> </select> <a id='anc' href="" onclick="return false;">New Page</a> </form>