为什么这个jQuery的AJAX PUT工作在Chrome但不是FF [英] Why does this jQuery AJAX PUT work in Chrome but not FF

问题描述

在Chrome浏览器这样做PUT就像它应该是HTTP，但在Firefox 21没有。有在JavaScript的控制台或在后端没有错误。

In Chrome this does an HTTP PUT just like it should, but in FireFox 21 it doesn't. There are no errors in the javascript console or in the backend.

下面是HTML：

<div id="createTeamModal" class="small reveal-modal">
        <form id="createTeamForm">
            <div class="row"><p id="teamFlavorText" class="lead">Building a new team</p></div>
            <div class="row">
                <div class="small-4 large-4 columns"><label>Team Name:</label></div>
                <div class="small-6 large-6 columns"><input name="teamName" id="teamName" type="text" size="20"/></div>
            </div>
            <div class="row"><p class="lead">Does this team work for a business?</p></div>
            <div class="row">
                <div class="small-4 large-4 columns"><label>Business Size:</label></div>
                <div class="small-6 large-6 columns">
                    <select id="businessSizeSelect" name="businessSizeSelect">
                    <option value="1">Nope, I work alone</option><option value="2">2 to 49</option><option value="3">50 to 99</option><option value="4">100 to 999</option><option value="5">1,000+</option>
                    </select>
                </div>
            </div>
            <div id="businessLocationDiv" class="row" style="display: none; margin-top: 20px;">
                <div class="small-4 large-4 columns"><label>Business Location:</label></div>
                <div class="small-6 large-6 columns">
                    <select id="businessLocationSelect" name="businessLocationSelect">
                    </select>
                </div>
            </div>
            <div id="businessTypeDiv" class="row" style="display: none; margin-top: 20px;">
                <div class="small-4 large-4 columns"><label>Industry:</label></div>
                <div class="small-6 large-6 columns">
                    <select id="businessTypeSelect" name="businessTypeSelect">                      
                    </select>
                </div>
            </div>
            <div class="row" style="margin-top: 20px;">
                <div class="large-offset-10 small-1 large-1 columns">
                    <button id="createTeamButton" class="small button">Create</button>
                </div>
            </div>
        </form>
        <a class="close-reveal-modal">&#215;</a>
    </div>

这里是jQuery的：

And here is the jQuery:

$("#createTeamButton").click(function () {
    var teamObject = new Team();
    teamObject.description = $("#teamName").val();
    teamObject.businessSize = $("#businessSizeSelect").val();
    teamObject.businessType = $("#businessTypeSelect").val();
    teamObject.businessLocation = $("#businessLocationSelect").val();

    $.ajax({
        type: "PUT",
        url: "/ajax/rest/team",
        dataType: "json",
        data: JSON.stringify(teamObject),
        success: function () {
            // Reload the team select box
            loadTeamSelectBox();

            // Pop up the site create modal
            $('#createSiteModal').foundation('reveal', 'open');
        },
        error: ajaxErrorHandler
    });
});

我观察到它们在提琴手，和工作（铬）和不工作（火狐）之间的差别在于，在镀铬的HTTP PUT火灾和不在Firefox闪光。

I have observed them in Fiddler, and the difference between working (Chrome) and not working (Firefox) is that the HTTP PUT fires in Chrome and does not fire in Firefox.

现在，我知道jQuery.ajax说就是不能在所有浏览器的保证。

Now, I know that jQuery.ajax PUT is not guaranteed in all browsers.

我读

• <一个href="http://stackoverflow.com/questions/165779/are-the-put-delete-head-etc-methods-available-in-most-web-browsers">Are在大多数Web浏览器中可用的PUT，DELETE，HEAD等方法？
• http://annevankesteren.nl/2007/10/http-method-support

• Are the PUT, DELETE, HEAD, etc methods available in most web browsers?
• http://annevankesteren.nl/2007/10/http-method-support

这些网站重申，PUT并非在所有浏览器中工作，但应该在FF。

These sites reaffirm that PUT may not work in all browsers, but should work in FF.

最后，我打与FF21以下和PUT作品

Finally, I hit the following with FF21 and PUT works

• http://www.mnot.net/javascript/xmlhtt$p$pquest /

我可以肯定工程师解决这个问题，但在我看来，这应该工作。我宁愿不杰里 - 钻机的东西，而是让jQuery的阿贾克斯正常工作。

I could certainly engineer around this, but it seems to me this should work. I would rather not jerry-rig something, but rather get jQuery's .ajax to work properly.

其他详细信息： * jQuery的版本2.0.0 *后端是Spring3

Other Details: * jQuery version 2.0.0 * Backend is Spring3

推荐答案

下面是一个令人失望的答案。该按钮被点击提交表单，即使它没有义务这样做。我把的onsubmit =返回false;在形式和问题得到解决。

Here's a disappointing answer. The button click was submitting the form, even though it was not bound to do that. I put onsubmit="return false;" in the form and the problem was resolved.

这篇关于为什么这个jQuery的AJAX PUT工作在Chrome但不是FF的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！