chrome中的jQuery加載函數表格

我有一個用戶頁面，帶有添加用戶按鈕。當用戶點擊添加按鈕，用戶一個Ajax load()函數被調用，它加載一個adduserform當在Firefox，IE工作的。chrome中的jQuery加載函數表格

然而，當鉻jQuery的對話框負荷沒有錯誤，但表單標籤不加載。

<form id="adduser"> 
    <select id="ptsiid" name="ptsiid" onchange="secondarySiteDisplay();"> 
     <option value=""></option> 
     <option value="1666">London</option> 
     <option value="1544">NYC</option> 
    </select>First Name: 
    <input type="text" name="firstname" value="" size="15" maxlength="60">Last Name: 
    <input type="text" name="lastname" value="" size="15" maxlength="60">Job Title: 
    <input type="text" name="jobtitle" value="" size="20" maxlength="40">E-mail: 
    <input type="text" name="email" value="" size="40" maxlength="128">Can Login? 
    <td class="data" align="left"> 
     <input type="checkbox" name="canlogin"> 
    </td>Is Deleted? 
    <td class="data" align="left"> 
     <input type="checkbox" name="isdeleted"> 
    </td>Change Password? 
    <td class="data" align="left"> 
     <input type="checkbox" name="changepassword"> 
    </td> 
    <input class="button" type="button" value="Update" onclick="doAjaxSubmit();" accesskey=""> 
</form>

來源

2013-07-31 Sunny Patel

您的問題是在這條線

jQuery('#popup').load("form.html", showDialog);

Chrome的強制執行same origin policy至極意味着你的要求將不會被加載，因爲它有不同的起源不是在網頁中的其他元素。

上jQuery's load method的文件也提到了這一點。

你可以找到一個什麼樣的域名是here和here一個更好的描述。從前面的鏈接引用的這段話，在我看來很好地描述了它。

跨站點的HTTP請求來自除發出請求的資源的域不同域資源的HTTP請求。例如，從域A加載的資源（http://domaina.example）如HTML網頁，使得對域B （http://domainb.foo），資源的請求，諸如圖像，使用img元件（http://domainb.foo/image.jpg）。這今天在網絡上出現非常普遍 - 網頁加載一個跨站點的方式，包括CSS樣式表，圖像和腳本，和其他資源的資源數量。

截至今日（2013年8月）this is an open issue in Chrome。

最後，這就是爲什麼你的代碼不能在chrome中工作。

編輯：

Here is a workarround for Chrome.它將工作，只要你不嘗試加載使用文件本地文件：//架構。

編輯，第二部分：

我不知道你想要做的事情，但由於form.html只包含一個表單，你可以把你的頭版內。這樣你就不必加載外部html。它改變了你一直在做的事情（它不會加載外部頁面），但它可以在Chrome中運行。我也在IE，Safari和Opera上測試過它。所以它應該工作，無論你決定使用哪個瀏覽器。

Here's a fiddle帶有工作代碼。

編輯，第三部分：

我認真建議更換你堅持上述方法，但...

...如果你真的需要你的內容將在一個外部頁面，你'使用類似php或.NET的東西，你不能使用ajax從服務器獲取你的頁面並將它們發佈到你的div中。它有點複雜。基本上你需要在服務器端代碼中有一個方法，以網頁的形式作爲局部視圖。在.NET中，你會寫這樣的東西。

public PartialViewResult getForm() 
{ 
    return PartialView("form.html"); 
}

我不熟悉PHP，但代碼應該是類似的東西。您還需要一個JavaScript函數來獲取內容並把它包含div內：

function loadFrame() 
{ 
    $.ajax({ 
    url: "@Url.Action("getForm","Form")", 
    async: false 
    }).done(function(data) { 
    $("#popup").append(data); 
    // we don't want to show the frame until the user has clicked on the button. 
    // so we make it invisible. 
    $("#popup").css("display","none"); 
    }); 
}

來源

2013-08-06 02:31:18 Demian

在這裏你可以找到工作代碼。 [鏈接]（http://jsfiddle.net/KRytZ/3/）我不知道它是否有用，你需要做什麼。但它確實會成功加載幀。 – Demian

以下是你的jsfiddle缺少的東西。

1）您錯過了添加jQuery lib。

2）還錯過了添加jQuery UI。

3）既然你已經在負荷包裝你的代碼，

function addeditUser() { 
    jQuery('#popup').load("form.html", showDialog); 
    alert(jQuery('#popup').text()); 
}

這是不行的。

而是使用類似這樣的

addeditUser = function() { 
    jQuery('#popup').load("form.html", showDialog); 
    alert(jQuery('#popup').text()); 
}

或

敷在頭

檢查JSFiddle

來源

2013-08-05 08:24:03 Praveen

包裝你的代碼」 ve說不要使用'addeditUser'作爲函數，而是分配給一個變量 - 但爲什麼？而你小提琴不使用它。 –

@IanClark在我的小提琴中，我將它包裝在''下，其中的區別是'addeditUser = function（）{'是一個運行時聲明。這就是所謂的**函數聲明與函數表達式**希望你有一個想法。 – Praveen

好的，我錯過了「或者包在頭上」，很好 –

這可能會幫助你試試這個

嘗試在$(document).ready()

$(document).ready(function(){ 
    $("#getit").load("form.html #getdiv"); 
});

來源

2013-08-12 08:27:38 krishna

將不起作用... – User2413

chrome中的jQuery加載函數表格

回答

相關問題