开发者

Have to click twice to submit the form in IE8

A very peculiar bug in a simple html form. After changing an option, button has to be clicked twice to submit the form. Button is focused after clicking once, but form is not submitted. It's only this way in IE8 and works fine in Chrome and FF.

PAY ATTENTION TO 'g^' right before <select>. It has to be a letter or number followed by a symbol to generate this bug. For example, 'a#','f$','3(' all create the same bug. Otherwise 开发者_如何学Pythonit works fine. BTW, if you don't change option and click button right away,there won't be any bug.

Very strange, huh?

<form method="post" action="match.php">
g^
<select>
<option>Select</option>
<option>English</option>
<option>French</option>
</select>

<input type="submit" value="Go" />
</form>


I am providing the code here, which is working fine. Check this code whether this code also is giving you the problem.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title> Sample page for language selection </title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<style type="text/css">
    p{display: none;}
</style>

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

<script type="text/javascript">
    $(function() {
        // language as an array
        var language = ['Arabic', 'Cantonese', 'Chinese', 'English', 'French', 'German', 'Greek', 'Hebrew', 'Hindi', 'Italian', 'Japanese', 'Korean', 'Malay', 'Polish', 'Portuguese', 'Russian', 'Spanish', 'Thai', 'Turkish', 'Urdu', 'Vietnamese'];

        $('#muyu').append('<option value=0>Select</option>');

        //loop through array
        for (i in language)  //js unique statement for iterate array
        { 

        $('#muyu').append($('<option>', { id: 'muyu' + i, val: language[i], html: language[i] })) }

        $('form').submit(function() {
            // alert('I am being called!');  // check if submit event is triggered
            if ($('#muyu').val() == 0) { $('#muyu_error').show(); } else { $('#muyu_error').hide(); return true; }
            return false;
        });
    })
</script>
</head>

<body>
    <form method="post" action="PostProb">
        I am fluent in <select name='muyu' id='muyu'></select>
        <p id='muyu_error'>Tell us your native language</p>
        <input type="submit" value="Go"/>
    </form>
</body>
</html>
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜