Question

我正在尝试从对话框填充表单字段。我想要的是单击一个按钮，并在表单字段中填充一些文本。我有这个演示：

编辑：我解决了。

Answer 1

这是整个html.css和js包含全部来自jquery UI库。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>jQuery UI Dialog - Basic modal</title>
    <!--blueprint files being -->
    <link rel="stylesheet" href="assets/css/screen.css" media="screen, projection" />
    <link rel="stylesheet" href="assets/css/print.css" media="print" />
    <!--[if IE]>
    <link rel="stylesheet" href="assets/css/ie.css" media="screen,projection" />
    <![endif]-->
    <!-- blueprint files end-->
    <link rel="stylesheet" href="assets/css/jquery.ui.all.css">
    <link rel="stylesheet" href="assets/css/demos.css">
    <link rel="stylesheet" href="assets/css/jquery.ui.base.css">
    <link rel="stylesheet" href="assets/css/jquery.ui.theme.css">
    <script src="assets/js/jquery-1.7.1.js"></script>
    <script src="assets/js/jquery.bgiframe-2.1.2.js"></script>
    <script src="assets/js/jquery.ui.core.js"></script>
    <script src="assets/js/jquery.ui.widget.js"></script>
    <script src="assets/js/jquery.ui.mouse.js"></script>
    <script src="assets/js/jquery.ui.draggable.js"></script>
    <script src="assets/js/jquery.ui.position.js"></script>
    <script src="assets/js/jquery.ui.resizable.js"></script>
    <script src="assets/js/jquery.ui.dialog.js"></script>
    <link rel="stylesheet" href="assets/css/demos.css">
    <script>
    $(function() {
        // a workaround for a flaw in the demo system (http://dev.jqueryui.com/ticket/4375), ignore!
        $( "#dialog:ui-dialog" ).dialog( "destroy" );

        $( "#dialog-modal" ).dialog({
            height: 440,
            modal: true
        });
    });
    </script>
</head>
<body>

<div class="demo">
<form>
Image Path: <input id="example3b" name="firstname" /><br />
</form> 
<div id="dialog-modal" title="Basic modal dialog">
    <p>Adding the modal overlay screen makes the dialog look more prominent because it dims out the page content.</p>
   <p>
An image:
<img src="images/wolf-moon.jpg" alt="Wolf Moon" width="450" height="281" />
</p>
<br />
<form name="myform" >
    Type something in here:
    <input id="example3b" />
    <input name="SetValue" type="button" value="Set Value"/>
</form>
<script type="text/javascript">document.forms.myform.elements.SetValue.addEventListener("click", function () {
    var example3b = document.getElementById("example3b");
    // example3b === null

    var example3a = "hello";

    example3b.value = example3a;

});</script>

</div>

</body>
</html>

从对话框中设置表单域

1 个答案: