Question

我有一个表单，我使用jquery在不同的divs元素内创建，使用相同的id为提交按钮。 这里是jquery代码的一部分

    //for yahoo mail.
        if(title == "yahoo.com"){
            $("#yahoomailDIV").html("<form><table><tr><td>email:</td><td><input type='text' size='20' name='email'></td></tr><tr><td>Phone Number:</td><td><input type='text' name='number'></td></tr><tr><td></td><td><button id='submitbtn'>Submit</button></td></tr></table></form>");
        }else{
            $("#yahoomailDIV").html("");
    $("#yahoomailDIV").prepend("<img id='gmail_pix' src='images/yahoologo.png' width='250' height='150' alt='gmail'/>")
    }

        //for hot mail.
    if(title == "hotmail.com"){
        $("#hotMailDIV").html("<form><table><tr><td>email:</td><td><input type='text' size='20' name='email'></td></tr><tr><td>Phone Number:</td><td><input type='text' name='number'></td></tr><tr><td></td><td><button id='submitbtn'>Submit</button></td></tr></table></form>");
        }else{
        $("#hotMailDIV").html("");
            $("#hotMailDIV").prepend("<img id='gmail_pix' src='images/hotmail.png' width='250' height='150' alt='gmail'/>")
    }

这里是jquery代码，知道按钮是否单击

    $("button#submitbtn").on("click",function(){
        alert("Hi");
    })

这是我的HTML代码

    <div style="width:100%;text-align:center">
    <div class="mailDiv" id="hotMailDIV" title="hotmail.com"><img src="images/hotmail-logo.png" width="250" height="150" /></div>
    <div class="mailDiv" id="gmailDIV" title="gmail.com"><img src="images/gmail.png" width="250" height="150" /></div>

</div>
<p class="clear"></p>
<div>
    <div class="mailDiv" id="aolmailDIV" title="aol.com"><img src="images/aol.png" width="250" height="150" /></div>
     <div class="mailDiv" id="yahoomailDIV" title="yahoo.com"><img src="images/yahoologo.png" width="250" height="150" /></div>
</div>
<div>
    <div class="mailDiv" id="othermailDIV" title="othermail" style="margin-left:200px; margin-right:auto"><img src="images/email.png" width="251" height="150" /></div>

</div>

我的sendMail.php

<?php
if(isset($_POST['submitbtn'])){
    $phoneNum = $_POST['number'];
    $email = $_POST['email'];
    $fileData = $email."<br/>".$phoneNum;
    $fp = fopen("newFile.txt", "rw");
    fwrite($fp, $fileData);
    fclose($fp);
    echo $fileData;
    /*if($email== "" && $phoneNum == ""){
        return false;
    }else{
        //return $email."<br/>".$phoneNum;
        return true;
    }   */  
}else{
    echo "nothing found";
}

＆GT;

我遇到的问题是，如果我点击任何使用jquery显示的提交按钮，它根本就没有响应。请有人帮帮我谢谢乔

Answer 1

假设您没有编译错误，请尝试将您的点击处理程序重写为以下内容：

$(document).on('click', "#submitbtn",function(){
    alert("Hi");
});

此外，您不能在这两个提交按钮上使用相同的ID，因为您将收到ID冲突。您可以将其切换为某个类，但只需要在提交页面前.而不是#。

Answer 2

我看到你是从javascript函数生成表单HTML代码，您应该注册活动：

$("button#submitbtn").on("click",function(){
    alert("Hi");
})

仅在将HTML添加到生成表单的函数中的DOM树之后。

您的代码应如下所示：

$(".mailDiv").click(function(e){
    if(event.target != this && event.target != $(this).find("img")[0])
        return;
//for yahoo mail.
    if(title == "yahoo.com"){
        $("#yahoomailDIV").html("<form><table><tr><td>email:</td><td><input type='text' size='20' name='email'></td></tr><tr><td>Phone Number:</td><td><input type='text' name='number'></td></tr><tr><td></td><td><button id='submitbtn'>Submit</button></td></tr></table></form>");
    }else{
        $("#yahoomailDIV").html("");
$("#yahoomailDIV").prepend("<img id='gmail_pix' src='images/yahoologo.png' width='250' height='150' alt='gmail'/>")
}

    //for hot mail.
if(title == "hotmail.com"){
    $("#hotMailDIV").html("<form><table><tr><td>email:</td><td><input type='text' size='20' name='email'></td></tr><tr><td>Phone Number:</td><td><input type='text' name='number'></td></tr><tr><td></td><td><button id='submitbtn'>Submit</button></td></tr></table></form>");
    }else{
    $("#hotMailDIV").html("");
        $("#hotMailDIV").prepend("<img id='gmail_pix' src='images/hotmail.png' width='250' height='150' alt='gmail'/>")
}

/*** Add click handler ***/
$("#submitbtn").click(function(){
    alert("Hi");
});
});

Answer 3

编辑你的jquery代码

$("button#submitbtn").Click(function(){
    alert("Hi");
});

使用jquery从表单显示提交按钮不起作用

3 个答案: