[英]Spastic img results on element.html() call
這個問題有2個要素需要理解
GetProdImage.cs
//Retrieves image from db based on id
int id = Page.RouteData.Values["prod_id"];
Controller controller = new Controller();
DBContext context = GetDBContext();
ProductImage productImage = controller.GetImage(id);
context.Response.Clear();
context.Response.ContentType = "image/"+productImage.ImageExt;
context.Response.BinaryWrite(productImage.bindata);
context.Response.Flush();
jQuery HTML構建
<script>
function ihatemylife()
{
debugger;
var html = "<img src=\"http://localhost:3756/GetProdImage/10\" style=\"max-width: 200px;\"/>" +
"<img src=\"http://localhost:3756/GetProdImage/11\" style=\"max-width: 200px;\"/>" +
" <img src=\"http://localhost:3756/GetProdImage/12\" style=\"max-width: 200px;\"/>";
$("#sm-test").html(html);
}
});
</script>
<div id="sm-test"></div>
請注意,每個圖像只是一個紅色數字。
使用標准將其插入DOM元素
$(element).html(html);
此生成產生以下內容:
每列都是頁面刷新。 請注意順序永遠不會相同。
檢查頁面(證明html正確)
如果將斷點放置在GetProdImage.cs中,則可以看到在插入html時調用了該斷點。 奇怪的是,id的值反映了痙攣的圖像排序,而不是html中反映的內容。
即第一次迭代GetProdImage用12、10、12調用第二次迭代用11、12、12等調用
這種觀察使我認為這與我的jQuery實現有關。
如果訪問了GetProdImage的每個URL,它將產生正確的圖像。
所以要測試一下:
如果我一起切掉GetProdImage()並對公共圖像使用硬編碼的img src值,如下所示:
html += "<td><img title=\"" + i + "\" src=\"https://upload.wikimedia.org/wikipedia/commons/d/d0/DJCTQ_-_10.JPG\" />" +
"<img title=\"" + i + "\" src=\"https://upload.wikimedia.org/wikipedia/commons/9/9d/French_Military_Button_Rgmt_Number_11.jpg\"/>" + " <img title=\"" + i + "\" src=\"http://thumb1.shutterstock.com/display_pic_with_logo/569284/257460898/stock-photo-number-257460898.jpg\""/></td>";
我相信我的矛盾現在很清楚。
從注釋中調試 1)標記直接放置在頁面上,而不是通過使用GetProdImage as src通過jquery調用加載,每次都能正常工作。
2)對於調用jquery的頁面,Turing EnableSessionState =“ false”無效。
是什么會導致GetProdImage的行為以隨機順序接收(和返回)圖像?
接收到的隨機數表明JQuery有問題。
硬編碼的img src指向GetProdImage。
我很笨
這些是我的問題。
問題在這里
GetProdImage.cs
int id = Page.RouteData.Values["prod_id"];
設置ID發生了競爭情況。
我將其更改為HttpContext驅動,而不是REST。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.