选择选项onchange时在锚标记中显示值

Question

Below is script when select option onchange input box will echo the value for select option :

<select id="theSelect">
 <option value="888">Foo</option>
 <option value="999">Bar</option>
</select>
<br />
<input id="someInput"/>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
<script>
  $("#theSelect").change(function() {
  $("#someInput").val($(this).val());
  }).change(); // trigger once if needed
</script>

My question is how to echo value inside the Anchor Tag(refer id value) :

example : <a href="index.php?id=999" id="link">Click here</a>

thanks.

Answer 1

You can use prop() method to set href value for the link:

$("#theSelect").on("change", function() {
    $("#link").prop("href", "index.php?id=" + this.value);
});

Answer 2

Try this

​

$(function() {
    $('#theSelect').on('change' , function() {
        var $anchor = $('#link')
        var currVal = $(this).find('option:selected').val();
        alert('Old href is : ' + $anchor.attr('href'));
        $anchor.attr('href' , 'index.php?id=' + currVal);
        alert('New href is : ' + $anchor.attr('href'));

    })
});​

Check DEMO