如何使用不同的参数传递iframe src url动态并将其放入弹出窗口？

Question

点击后我想将带有url的输入值传递给popwindow.jsp，它应该是动态功能。如何让下面的代码动态化？

HTML

<div>
    <input type="text" name="prod1" id="prod1" value="Type01">
    <input type="text" name="fruits" id="fruits" value="fruits">
    <a href="#" id="fruitClick">Click Here</a>
</div>
</br>
<div>
    <input type="text" name="prod2" id="prod2" value="Type02">&nbsp;&nbsp;&nbsp;
    <input type="text" name="vegs" id="vegs" value="vegetables">&nbsp;&nbsp;&nbsp;
    <a href="#" id="vegsClick">Click Here</a>
</div>
</br>
<div>
    <input type="text" name="prod3" id="prod3" value="Type03">&nbsp;&nbsp;&nbsp;
    <input type="text" name="desserts" id="desserts" value="desserts">&nbsp;&nbsp;&nbsp;
    <a href="#" id="dessertsClick">Click Here</a>
</div>
<div id="dialog" style="display:none;" title="Dialog Title"><iframe frameborder="0" scrolling="no" width="700" height="700" src="http://localhost:9090/DropDownDemoWeb/DropDownServlet?type=Type01&value=fruits"></iframe></div>

的JavaScript

$( "#fruitClick" ).click(function() {
    $( "#dialog" ).dialog( "open" );
});

$("#dialog").dialog({
    autoOpen: false,
    position: 'center',
    title: 'EDIT',
    draggable: false,
    width : 500,
    height : 300,
    resizable : true,
    modal : true,
});