-1 
**DEVELOPMENT.JS**
jQuery(function ($) {
$("#doContact").click(function(e) {
    e.preventDefault();
    alert("ho"); // ---- It doesn't alert ----
    $("#contact-result").html('<img src="<%THEME%>images/loading.gif">');
    var formData = $("#registerForm").serialize();
    $.post("?page=register", formData, function(response)
    {
        if(response.status == 'success')
        {   
            $.modal.close();
            $('#register-success').modal({ opacity:80 });
        }
        else
        {
            $("#register-result").addClass('register-error');
            $("#register-result").html(response.error_message);
        }
    },'json');
});
});

**CONTACTFORM.HTML**
<form id="contactForm" action="#" method="post" class="centered stylish">
        <div id="contact-result">
            <div>
                <p><label for="username" class="label">Adınız:</label>
                <input id="username" placeholder="Adınız..." name="username" maxlength="20" type="text" tabindex="1" class="input" /></p>

                <p><label for="email" class="label">Email: (geri dönüş için gerekli)</label>
                <input id="email" placeholder="Email adresiniz..." name="email" maxlength="70" type="text" tabindex="2" autocomplete="off" class="input"/></p>

                <p><label for="message" class="label">Mesajınız:</label>
                <textarea id="message" placeholder="Mesajınız..." cols="60" rows="10" name="message" maxlength="1000" type="text" tabindex="2" autocomplete="off" class="input"/></p>

                <p>
                    <button id="doContact" class="ui-button button1" type="submit"> 
                        <span class="button-left">
                            <span class="button-right">Mesajımı Gönder</span>
                        </span>
                    </button>
                </p>
            </div>
        </div>
</form>

問題は単純です。

jQueryは現在、ページの読み込み時に配置された他のdivに対して機能します。（例：ナビゲーションバーの右上にある黄色のログインエリア）

ただし、このフォームはAJAX呼び出しによって読み込まれるため、delegateまたはのような関数を使用する必要があると思いますlive。それが事実かどうかはわかりませんが。

ご覧いただけますか？

4

3 に答える 3

1

解決策は次のとおりです。

$(document).delegate("#doContact", "click", function(){
于 2013-02-04T10:23:08.390 に答える
1

この行を変更します。

$("#doContact").click(function(e) {

これに：

$("#contactForm").submit(function(e) {

また、button:<button id="doContact"を送信ボタンに変更します。<input type="submit">

編集: これをどのように達成しようとしているのかわかりませんが、これは私が行う方法です-これは機能します:

<div id="output"></div>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>
    // 1. Load the form.html file, and grab the form with an id of '#contactForm'
    // 2. Insert the form with id '#contactForm' into the div with id '#output'
    // 3. Submit the form
    $('#output').load('form.html #contactForm', function (html, status, xhr) {
        $('#contactForm').submit(function(e) {
            e.preventDefault();
            alert('Form has been submitted!');
        });
    });
</script>

あなたのform.html

<div class="leftArea centered"> 
    <h2>İletişim</h2>
    <form id="contactForm" action="#" method="post" class="centered stylish">
            <div>
                <p><label for="username" class="label">Adınız:</label>
                <input id="username" placeholder="Adınız..." name="username" maxlength="20" type="text" tabindex="1" class="input" /></p>

                <p><label for="email" class="label">Email: (geri dönüş için gerekli)</label>
                <input id="email" placeholder="Email adresiniz..." name="email" maxlength="70" type="text" tabindex="2" autocomplete="off" class="input"/></p>

                <p><label for="message" class="label">Mesajınız:</label>
                <textarea id="message" placeholder="Mesajınız..." cols="60" rows="10" name="message" maxlength="1000" type="text" tabindex="2" autocomplete="off" class="input"/></p>

                <p>
                    <input type="submit" value="Contact Me">
                </p>
            </div>
    </form>
</div>
于 2013-02-04T09:19:04.910 に答える