【问题标题】:How to set the input value in a modal dialogue?如何在模态对话框中设置输入值?
【发布时间】:2011-12-12 08:25:24
【问题描述】:

我正在开发“添加链接”功能。为此,我使用Modal plugin from Twitter Boostrap JS。在主页上只有“链接”字段要填写,当用户单击“添加链接”按钮时,会弹出一个模式,用户会看到完整的表单要填写 3 个字段:链接、标题、标签。但是,我希望链接字段预先填充上一步中的值。这类似于您在delicious.com 上“保存链接”时发生的情况。

感谢 Joe 的帮助 (previous question) 我可以在模态对话框中打印 linkURL,但重要的是这个 linkURL 是表单的链接字段的值,包含 3 个字段(链接、标题、标签)。知道如何做到这一点吗?

<html>
<head>
  <title>Example</title>
  <script src="scripts/jquery.min.js"></script>
  <script src="scripts/bootstrap-modal.js"></script>
  <link rel="stylesheet" href="scripts/bootstrap.min.css">
  <link rel="stylesheet" href="main.css" />

  <script type="text/javascript">
            $(document).ready(function()
            {
                $('#modal-from-dom').bind('show',function()
                {
                    $(".modal-body").html($("#linkURL").val());
                });
            });
    </script>
</head>
<body>
  <!-- The Modal Dialog  -->
          <div id="modal-from-dom" class="modal hide fade">
            <div class="modal-header">
                <a href="#" class="close">&times;</a>
                <h3>Add Link</h3>
            </div>
            <div class="modal-body">
            <!--
            <form id='post-on-wall' method='POST' action='savePost.php' enctype='multipart/form-data'>"
        <input type='text' class='label-inline' name='linkURL' id='wall-post' value=linkURL>
            </form>
            -->
            </div>
            <div class="modal-footer">
                <a href="#" class="btn primary">Add Link</a>
            </div>
        </div>
  <div class="container">
    <div class="wall-post">
        <textarea class='label-inline' name='linkURL' id='linkURL'></textarea>
        <button data-controls-modal="modal-from-dom" data-backdrop="true" data-keyboard="true" class="btn">Add Link</button>
    </div>
  </div>

</body>

【问题讨论】:

    标签: jquery twitter-bootstrap modal-dialog jquery-events


    【解决方案1】:
          $('#modal-from-dom').bind('show',function()
                {
                    $(".modal-body #wall-post").val($("#linkURL").val());
                });
    

    还是我错过了什么? :)

    【讨论】:

    • 非常感谢,Marco,这就是我要找的东西!
    • 它对我不起作用 .bind 没有触发 $('#edit-child-modal').bind('shown', function () { $(".modal-content #Name" ).val('test'); });
    猜你喜欢
    • 1970-01-01
    • 2013-02-27
    • 1970-01-01
    • 2021-10-30
    • 1970-01-01
    • 1970-01-01
    • 2020-03-02
    • 2016-10-16
    • 2012-12-23
    相关资源
    最近更新 更多