如何使用 jquery Impromptu 从文本 div 的下拉列表中选择值答案

【问题标题】：how to select value in a dropdown from a text div using jquery Impromptu如何使用 jquery Impromptu 从文本 div 的下拉列表中选择值
【发布时间】：2011-09-08 04:07:28
【问题描述】：

从 jquery impromptu demo 中，出于我的目的，我在弹出表单中添加了一个下拉列表，但我在弄清楚如何在模式表单的下拉列表下填充“选定”值时遇到问题。

看看我的example，在结果框中，请注意列表中的名字是“Mr John Doe”，如果您单击“编辑”链接，您将在下拉列表下看到，标题写着“夫人”。我希望实现在“标题”下拉列表中填充正确的值，在这种情况下，它应该说“先生”。

代码：

function editUser(id){
    var user = $('#userid'+id)
    var fname = user.find('.fname').text();
    var lname = user.find('.lname').text();
    var title = user.find('.title').val();

    var txt = 'What would you like to change this to?'+
    '<div class="field"><label for="editfname">First Name</label><input type="text" id="editfname" name="editfname" value="'+ fname +'" /></div>'+
    '<div class="field"><label for="editlname">Last Name</label><input type="text" id="editlname" name="editlname" value="'+ lname +'" /></div>'+
    '<div class="field"><label for="edittitle">Title</label><select id="edittitle" name="edittitle" value="'+ title +'" /><option value="mrs" >Mrs</option><option value="mr" >Mr</option><option value="dr" >Dr.</option></select></div>';

...
}

HTML 代码：

<div id="userid1" class="user">
    <span class="controls">
         <a href="javascript:;" title="Edit User" class="edituser" onclick="editUser(1);">Edit</a>
    </span>
    <span class="fname">John</span>
    <span class="lname">Doe</span>
    <span class="title">Mr</span>
</div>

希望我能很好地解释它并感谢任何指示。谢谢。

【问题讨论】：

在您的演示中，我没有看到下拉菜单：？
不，那不是我的演示，那是即兴插件的演示，我只是添加了下拉菜单。
告诉我你到目前为止所做的尝试。
这是我的例子，jsfiddle.net/100d/APGu4/12

标签： jquery modal-dialog impromptu

【解决方案1】：

像这样将加载的选项添加到 $.prompt：

loaded: function() { $("#edittitle").val(title); },

还可以使用以下内容：

var title = user.find('.title').text();

而不是你目前拥有的：

var title = user.find('.title').val();

最后要确保你的命名是一致的。对于您的选项值，请确保使用与所选文本相同的值。不要混用你的箱子！例如，您需要以下选项：

<option value="Mrs">Mrs</option><option value="Mr">Mr</option><option value="Dr">Dr</option>

进行这些更改，一切都会正常运行！

【讨论】：