- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
基本上,我正在尝试开发一个 ASPX 页面,用户可以在其中上传图像,然后将其显示在模式弹出窗口中,并根据需要进行裁剪。
如果我在弹出窗口外部显示图像,它工作完全正常,但如果我尝试在弹出窗口内部显示图像,则不会显示图像。但是,我注意到如果我将图像保留在那里并删除 <asp:Image ID="imgCrop"
从下面的 JavaScript 中,显示了图像,当然它不允许我裁剪它。
这是我用来显示模式弹出窗口并设置裁剪设置的 javacripts:
<head runat="server">
<title>Crop Image</title>
<link href="Styles/jquery.Jcrop.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script type="text/javascript" src="Scripts/jquery.Jcrop.js"></script>
<script type="text/javascript" src="scripts/jquery.helper.js" ></script>
<link href="styles/style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
jQuery(document).ready(function () {
jQuery('#imgCrop').Jcrop({
onSelect: storeCoords
});
});
function storeCoords(c) {
jQuery('#X').val(c.x);
jQuery('#Y').val(c.y);
jQuery('#W').val(c.w);
jQuery('#H').val(c.h);
};
</script>
</head>
这里是模态弹出窗口的定义,我想在 <asp:Image ID="imgCrop"
中看到要裁剪的图像。
<input class="button_popup" id="btnShowModalDiv" onclick="$('#divSimplePopup').showModal(); return false;" type="submit" value="Show Modal Div"/>
<div id="divSimplePopup" class="popup" style="display: none; width: 350px;">
<div class="container">
<div class="header">
<span id="lblPopupHeader" class="msg">Simple Popup Header</span>
<a id="btnClosePopup" class="close" onclick="$('#divSimplePopup').hideModal(); return false;" ></a>
</div>
<div>
<div class="body" style="height: 100px; overflow: auto;">
<asp:Panel ID="pnlCrop" runat="server" Visible="false">
<asp:Image ID="imgCrop" runat="server" />
<br />
<asp:HiddenField ID="X" runat="server" />
<asp:HiddenField ID="Y" runat="server" />
<asp:HiddenField ID="W" runat="server" />
<asp:HiddenField ID="H" runat="server" />
<asp:Button ID="btnCrop" runat="server" Text="Crop" OnClick="btnCrop_Click" />
</asp:Panel>
</div>
<div class="footer">
<input class="button_popup" id="btnOK" style="width: 40px;" type="submit" value="OK"/>
<input class="button_popup" id="btnCancel" onclick="$('#divSimplePopup').hideModal(); return false;" type="submit" value="Cancel"/>
</div>
</div>
</div>
</div>
源代码和引用: http://geekswithblogs.net/vladimirl/archive/2009/12/20/jquery-simple-modal-plugin.aspx http://supershope.com/tuvianblog/cropimage.zip
有人有任何提示吗?
最佳答案
<asp:Image ID="imgCrop" runat="server" />
您的图像具有 runat="server",因此在渲染时它可能具有不同的 ID。
因此您的页面中需要有以下内容。
jQuery(document).ready(function ()
{
jQuery('#<%= imgCrop.ClientID %>').Jcrop({
onSelect: storeCoords
});
});
除此之外,您还可以在面板上看到visible="false",如下面的代码所示:
<asp:Panel ID="pnlCrop" runat="server" Visible="false">
因此整个面板将不会被渲染,并且您的 jquery 代码将无法工作。相反,使用 style="display:none",面板将被渲染,因此图像将被渲染,并且您的插件将正常工作。
关于javascript - 使用 javascript 和 asp.net 在模态弹出窗口中不显示图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17859469/
我来自 Asp.Net 世界,试图理解 Angular State 的含义。 什么是 Angular 状态?它类似于Asp.Net中的ascx组件吗?是子页面吗?它类似于工作流程状态吗? 我听到很多人
我一直在寻找 3 态拨动开关,但运气不佳。 基本上我需要一个具有以下状态的开关: |开 |不适用 |关 | slider 默认从中间开始,一旦用户向左或向右滑动,就无法回到N/A(未回答)状态。 有人
我是一名优秀的程序员,十分优秀!