Question

我想将几个表单字段连接到span或div区域。我在网上找到了一个非常适合我的脚本。但它将字段连接到另一个表单字段。

我需要更改什么来告诉它将它放在span / div中。

我做了一个小提琴来帮助解释我之后的事情。 http://jsfiddle.net/3ZHfB/

提前干杯!!

Answer 1

    <form method="post" action="">


        <div class="field">
            <label for="Title">Title:</label>
            <select name="Title" id="Title">
                            <option value="" selected="selected">Select...</option>
                            <option value="Mr">Mr</option>
                            <option value="Mrs">Mrs</option>
                            <option value="Miss">Miss</option>
                            <option value="Ms">Ms</option>
                            <option value="Dr">Dr</option>
                            <option value="Revd">Revd</option>
                            <option value="Prof">Prof</option>
                            <option value="Judge">Judge</option>
                        </select>
        </div>

        <div class="field">
            <label for="First_Name"> First Name:</label>
            <input type="text" id="First_Name" name="First_Name" />
        </div>

        <div class="field">
            <label for="Last_Name"> Last Name:</label>
            <input type="text" id="Last_Name" name="Last_Name" />
        </div>

        <br>
        <br>

        <div class="field">
            <label for="copyPassDetails">Full Name:</label>
           <!-- <input type="text" id="copyPassDetails" name="address" /> -->
<div id="copyPassDetails"></div>
        </div>

    </form>
    <script>
    $('#Title, #First_Name, #Last_Name').bind('blur', function() {

        $('#copyPassDetails').html($('#Title').val() + ' ' +
                                 $('#First_Name').val() + ' ' +
                                 $('#Last_Name').val() );
    });
    </script>

试试这个，我已编辑过了    <input type="text" id="copyPassDetails" name="address" /> 这个    <div id="copyPassDetails"></div> 和 $（'＃copyPassDetails'）。val（ to $（'＃copyPassDetails'）。html（

要将值放在<div><span>标签中，您需要使用html和for   输入val

Answer 2

您的小提琴更新了答案，see this。

1）用span / div替换 copyPassDetails文本框：

    <div class="field">
        <label for="copyPassDetails">Full Name:</label>
        <span id="fullName"></span>
    </div>

2）用 span的html（）替换 textbox'val（）in bind function ：

$('#fullName').html($('#Title').val() + ' ' +
                         $('#First_Name').val() + ' ' +
                         $('#Last_Name').val() );

表格字段数据到span / div

2 个答案: