jquery - How to pass JavaScript function result to html when using onchange? -
i wonder how place user selected option somewhere in html text. user selection using javascript don't know how pass html.
my current code looks this. html:
<select id="profile" onchange="myfunction()"> <option>one</option> <option>two</option> <option>three</option> </select>
javascript:
function myfunction() { var user_selection = $( "#profile option:selected" ).text(); alert(user_selection); }
you can use jquery create new element , add dom this:
function myfunction() { var user_selection = $("#profile option:selected").text(); $('<div>' + user_selection + '</div>').insertafter('#profile'); }
also note using on*
event attributes considered outdated. should use unobtrusive event handlers. you're using jquery, here's how that:
$('#profile').change(function() { var user_selection = $(this).find('option:selected').text(); $('<div>' + user_selection + '</div>').insertafter(this); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <select id="profile"> <option>one</option> <option>two</option> <option>three</option> </select>
i suggest familiarise methods jquery has creating elements in dom around, inside , outside existing elements.
Comments
Post a Comment