使用图像提交表单问题

时间:2012-06-05 16:19:37

标签: javascript form-submit

我尝试了几个不同的提交按钮,但似乎无法使其正常工作。

<form id="logForm" action="<?php $retpage; ?>" method="POST" name="logForm">
    <div>
        <table width="400px" border="0" cellpadding="4" cellspacing="4" class="loginform">
            <tr> 
                <td colspan="2">
                </td>
            </tr>
            <tr> 
                <td width="28%">Email:</td>
                <td width="72%">
                    <input name="usr_email" type="text" class="required" id="txtbox" size="25" value="<?php
if(isset($_COOKIE['user_name'])){
            print ($_COOKIE['user_name']);
} else if(isset($_POST['usr_email'])){
            print ($_POST['usr_email']);
} else {
            print '';} ?>">
                </td>
            </tr>
            <tr> 
                <td>Password:</td>
                <td><input name="pwd" type="password" class="required password" id="txtbox" size="25"></td>
            </tr>
            <tr> 
                <td colspan="2">
                    <div align="center">
                        <input name="remember" type="checkbox" id="remember" value="1"> Remember me
                    </div>
                </td>
            </tr>
            <tr> 
                <td colspan="2">
                    <div align="center"> 
                        <p><input name="doLogin" type="image" id="doLogin" value="Login" src="images/login.png" style="vertical-align: middle; height: 30px; width: 66px;" onsubmit="document.logForm.submit(); return false;" /></p>           
                        <p><a href="signup.php">Register Free</a><font color="#FF6600">|</font> <a href="forgot.php">Forgot Password</a> <font color="#FF6600"></font></p>
                    </div>
                </td>
            </tr>
        </table>
    </div>
</form>

当我使用下面的提交按钮时,它完美地工作,但我想使用图像提交。上面的登录按钮不起作用。

<input name="doLogin" type="submit" id="doLogin" value="Login">

有什么建议吗?

3 个答案:

答案 0 :(得分:3)

取出onsubmit属性,然后使用:

<input type="image" src="foo.png" />

这将在点击时提交表单。

小提琴:http://jsfiddle.net/jonathansampson/q3SN8/

此外,您不打印您的操作:

action="<?php $retpage; ?>" // should be <?php echo $retpage; ?>

答案 1 :(得分:1)

或者jquery:

<img src="images/login.png" class="submitImage">

<script>
   $(".submitImage").click(function() {
       $("#logForm").submit();      
   });
</script>

Ofc,把这个贴在你的html页面的标签上:

 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

答案 2 :(得分:0)

我在顶部有这个:

if ($_POST['doLogin']=='Login')

{ php&amp; mysql代码 }

我把它拿出来并且工作正常。

我现在的问题是,为什么javascript不发布doLogin?