javascript - Add dynamic option selection list in jquery -
i need add selection menu dynamically.that means when user select on option selection menu add new new selection menu , when user select option new selection menu, should again add new option menu.
here have tried using jquery. double selection menu. , work first selection menu.how can change code meet requirement?.
<html> <head> <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.js"></script> <script> jquery(function ($) { $('.target').change(function () { $("select option:selected").each(function () { $('#other').append('<select class="target"><option value="3" selected="selected">option1</option><option value="4" selected="selected">option2</option> </select>'); }); }); }); </script> </head> <body> <form> <input class="target" type="text" value="field 1" /> <select class="target"> <option value="1" selected="selected">option 1</option> <option value="2">option 2</option> </select> </form> <div id="other"></div> </body> </html>
use on delegated event dynamically added element
$(document).on('change','.target',function() { $("select option:selected").each(function () { $('#other').append('<select class="target"><option value="3" selected="selected">option1</option><option value="4" selected="selected">option2</option> </select>'); }); });
delegating document works..however , recommeneded delegate closest static parent container performancewise.
Comments
Post a Comment