HTML5 форма с jQuery не работает в Chrome и Opera

Question

Я использовал точные файлы из этого урока: http://net.tutsplus.com/tutorials/javascript-ajax/submit-a-form-without-page-refresh-using-jquery/ Идея состоит в том, чтобы отправить форму без обновления и отобразить приятную анимацию после отправки. Но когда я пытаюсь использовать файлы для своей персонализированной формы, анимация не работает в Chrome и Opera. Почему?

<div id="contact_form">
    <form name="contact" method="post" action="">
        <p>Hi, my name is</p>
        <input type="text" name="name" id="name" class="input" size="20" value="" class="text-input" />

        <p> and my email is</p> 
        <input type="text" name="email" id="email" class="input" size="20" value="" class="text-input"/> 

        <p>More Random Text.</p> 
        <textarea name="message" id="message" class="input" onfocus="this.value='';" class="text-input"> ... </textarea>

        <input type="submit" name="submit" class="button" id="submit_btn" value="Send" />
    </form>
</div>

Answer 1

В этой скрипке все работает нормально:

http://jsfiddle.net/CTGa3/2/

Работает в Firefox и Chrome. Я не использую ваш php, потому что у меня нет к нему доступа. Вместо этого я делаю фиктивный вызов ajax через jsfiddle, но результат должен быть таким же.

Единственное, что я увидел, это то, что вы не включили код для runOnLoad. Если вы включите код или удалите вызов runOnLoad(), все работает нормально. Этот кусок кода в любом случае устарел, потому что jQuery может сделать это для нас. Вам просто нужно переместить эту строку:

$("input#name").select().focus();

В начало вашего блока кода jQuery:

http://jsfiddle.net/CTGa3/3/