在 jquery 中创建一个表单（大部分）[可联系]？

发布于 2024-12-11 16:53:31 字数 489 浏览 1 评论 0原文

我只需要有人帮助解释这个 JQ 插件中的 HTML。

插件和演示在这里：插件 & 演示

其名为“可联系”

person/people 使用 javascript 制作了一个弹出表单，大部分 html 都在 js 中，一个

   < div >

用于在 html 文件上调用表单。从本质上讲，它允许将非侵入式表单放置到页面上。

谁能帮忙解释一下编码的html部分谢谢

原文

I just need a little help fomr someone to help explain the HTML within this JQ plugin.

plugin and demo are here: plugin & Demo

its called "Contactable"

the person/people made a pop-out form using javascript, most of the html is in the js and one

   < div >

is used to call the form on a html file.
Essentually it allows for a non invasive form to be placed on to a page.

can anyone help explain the html part of the coding thanks

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

俏︾媚 2024-12-18 16:53:31

你需要解释什么？ jQuery 将以下 HTML 插入到选择器匹配的元素中（来自您链接到的演示页面）：

<div id="contactable_inner" style="margin-left: 377px; "></div>
<form id="contactForm" method="" action="" style="margin-left: -10px; ">
    <div id="loading"></div>
    <div id="callback"></div>
    <div class="holder">
        <p>
            <label for="name">Name<span class="red"> * </span></label><br>
            <input id="name" class="contact" name="name">
        </p>
        <p>
            <label for="email">Email <span class="red"> * </span></label><br>
            <input id="email" class="contact" name="email">
        </p>
        <p>
            <label for="message">Message <span class="red"> * </span></label><br>
            <textarea id="message" name="message" class="message" rows="4" cols="30"></textarea>
        </p>
        <p>
            <input class="submit" type="submit" value="SEND">
        </p>
        <p class="disclaimer">
            Please feel free to get in touch, we value your feedback
        </p>
    </div>
</form>

它使用以下长行来执行此操作。 this 将是对选择器匹配的任何元素的引用（如果有多个，则将表单插入到每个元素中）：

$(this).html('<div id="contactable_inner"></div><form id="contactForm" method="" action=""><div id="loading"></div><div id="callback"></div><div class="holder"><p><label for="name">'+options.name+'<span class="red"> * </span></label><br /><input id="name" class="contact" name="name"/></p><p><label for="email">'+options.email+' <span class="red"> * </span></label><br /><input id="email" class="contact" name="email" /></p><p><label for="message">'+options.message+' <span class="red"> * </span></label><br /><textarea id="message" name="message" class="message" rows="4" cols="30" ></textarea></p><p><input class="submit" type="submit" value="'+options.submit+'"/></p><p class="disclaimer">'+options.disclaimer+'</p></div></form>');

What do you need explaining? The jQuery inserts the following HTML into the element matched by the selector (from the demo page you linked to):

<div id="contactable_inner" style="margin-left: 377px; "></div>
<form id="contactForm" method="" action="" style="margin-left: -10px; ">
    <div id="loading"></div>
    <div id="callback"></div>
    <div class="holder">
        <p>
            <label for="name">Name<span class="red"> * </span></label><br>
            <input id="name" class="contact" name="name">
        </p>
        <p>
            <label for="email">Email <span class="red"> * </span></label><br>
            <input id="email" class="contact" name="email">
        </p>
        <p>
            <label for="message">Message <span class="red"> * </span></label><br>
            <textarea id="message" name="message" class="message" rows="4" cols="30"></textarea>
        </p>
        <p>
            <input class="submit" type="submit" value="SEND">
        </p>
        <p class="disclaimer">
            Please feel free to get in touch, we value your feedback
        </p>
    </div>
</form>

It does so with the following long line. this will be a reference to whatever element was matched by the selector (if there were several, the form is inserted into each):

$(this).html('<div id="contactable_inner"></div><form id="contactForm" method="" action=""><div id="loading"></div><div id="callback"></div><div class="holder"><p><label for="name">'+options.name+'<span class="red"> * </span></label><br /><input id="name" class="contact" name="name"/></p><p><label for="email">'+options.email+' <span class="red"> * </span></label><br /><input id="email" class="contact" name="email" /></p><p><label for="message">'+options.message+' <span class="red"> * </span></label><br /><textarea id="message" name="message" class="message" rows="4" cols="30" ></textarea></p><p><input class="submit" type="submit" value="'+options.submit+'"/></p><p class="disclaimer">'+options.disclaimer+'</p></div></form>');

回复收藏 0 原文

~没有更多了~