在下有一asp页面,有个div,放在页面最上边,就是一动图,加载中的话显示,成功后隐藏,这个样式可以给上,代码,问题不在这里,做个对比给诸位康康:
**<span class="hljs-tag"><<span class="hljs-name">div</span> <span class="hljs-attr">id</span>=<span class="hljs-string">"LoginAnimation"</span>></span><span class="hljs-tag"></<span class="hljs-name">div</span>></span>**
<span class="hljs-tag"><<span class="hljs-name">div</span> <span class="hljs-attr">id</span>=<span class="hljs-string">"PostOut"</span> <span class="hljs-attr">class</span>=<span class="hljs-string">"haveRadious"</span>></span>
<span class="hljs-tag"><<span class="hljs-name">label</span> <span class="hljs-attr">id</span>=<span class="hljs-string">"label1"</span>></span>有什么新鲜事想告诉大家?<span class="hljs-tag"></<span class="hljs-name">label</span>></span>
<span class="hljs-tag"><<span class="hljs-name">textarea</span> <span class="hljs-attr">id</span>=<span class="hljs-string">"txtpost"</span> <span class="hljs-attr">cols</span>=<span class="hljs-string">"30"</span> <span class="hljs-attr">rows</span>=<span class="hljs-string">"10"</span> <span class="hljs-attr">maxlength</span>=<span class="hljs-string">"2000"</span> <span class="hljs-attr">class</span>=<span class="hljs-string">"PostText"</span> <span class="hljs-attr">runat</span>=<span class="hljs-string">"server"</span>></span><span class="hljs-tag"></<span class="hljs-name">textarea</span>></span>
<span class="hljs-tag"><<span class="hljs-name">div</span> <span class="hljs-attr">style</span>=<span class="hljs-string">"height: 0px; overflow: hidden; position: absolute;"</span>></span>
<span class="hljs-tag"></<span class="hljs-name">div</span>></span>
<span class="hljs-tag"><<span class="hljs-name">div</span> <span class="hljs-attr">style</span>=<span class="hljs-string">"display:inline-block;"</span> <span class="hljs-attr">id</span>=<span class="hljs-string">"imgbox"</span>></span>
<%--图片按钮--%>
<span class="hljs-tag"><<span class="hljs-name">asp:FileUpload</span> <span class="hljs-attr">ClientIDMode</span>=<span class="hljs-string">"Static"</span> <span class="hljs-attr">AllowMultiple</span>=<span class="hljs-string">"true"</span> <span class="hljs-attr">ID</span>=<span class="hljs-string">"fuGetimg"</span> <span class="hljs-attr">runat</span>=<span class="hljs-string">"server"</span> <span class="hljs-attr">onchange</span>=<span class="hljs-string">"document.getElementById('btnimg2').click();"</span> <span class="hljs-attr">Style</span>=<span class="hljs-string">"visibility: hidden; height: 0px; overflow: hidden; position: absolute;"</span> /></span>
<span class="hljs-tag"><<span class="hljs-name">input</span> <span class="hljs-attr">id</span>=<span class="hljs-string">"btngetImg"</span> <span class="hljs-attr">type</span>=<span class="hljs-string">"button"</span> <span class="hljs-attr">value</span>=<span class="hljs-string">"图片"</span> <span class="hljs-attr">class</span>=<span class="hljs-string">"btn_pad btn btn-info"</span> <span class="hljs-attr">onclick</span>=<span class="hljs-string">"document.getElementById('fuGetimg').click(),showimgchose()"</span> <span class="hljs-attr">title</span>=<span class="hljs-string">"选择你要分享发布的图片吧~"</span> /></span>
<span class="hljs-tag"><<span class="hljs-name">asp:Button</span> <span class="hljs-attr">ID</span>=<span class="hljs-string">"btnimg2"</span> <span class="hljs-attr">ClientIDMode</span>=<span class="hljs-string">"Static"</span> <span class="hljs-attr">runat</span>=<span class="hljs-string">"server"</span> <span class="hljs-attr">Style</span>=<span class="hljs-string">"visibility: hidden; height: 0px; overflow: hidden; position: absolute;"</span> <span class="hljs-attr">Text</span>=<span class="hljs-string">"Button"</span> <span class="hljs-attr">OnClick</span>=<span class="hljs-string">"btngetImg_Click"</span> /></span>
<span class="hljs-tag"><<span class="hljs-name">div</span> <span class="hljs-attr">id</span>=<span class="hljs-string">"imgbox_hidden"</span>></span>
<span class="hljs-tag"></<span class="hljs-name">div</span>></span>
<span class="hljs-tag"><<span class="hljs-name">script</span>></span><span class="language-javascript">
<span class="hljs-comment">// ajax提交图片后显示图片展示框</span>
<span class="hljs-keyword">function</span> <span class="hljs-title function_">showimgchose</span>(<span class="hljs-params"></span>) {
$.<span class="hljs-title function_">ajax</span>({
<span class="hljs-attr">url</span>: <span class="hljs-string">"AfterLoginIndex.aspx"</span>,
<span class="hljs-attr">type</span>: <span class="hljs-string">"Post"</span>,
<span class="hljs-attr">async</span>: <span class="hljs-literal">true</span>,
<span class="hljs-attr">beforeSend</span>: <span class="hljs-keyword">function</span> (<span class="hljs-params"></span>) {
**$(<span class="hljs-string">"#LoginAnimation"</span>).<span class="hljs-title function_">show</span>()**
},
<span class="hljs-attr">success</span>: <span class="hljs-keyword">function</span> (<span class="hljs-params">res</span>) {
<span class="hljs-keyword">if</span> (res == <span class="hljs-string">"true"</span>) {
<span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(<span class="hljs-number">123</span>)
<span class="hljs-title function_">alert</span>(<span class="hljs-number">123</span>)
**$(<span class="hljs-string">"#LoginAnimation"</span>).<span class="hljs-title function_">hide</span>()**
$(<span class="hljs-string">"#imgbox_hidden"</span>).<span class="hljs-title function_">css</span>(<span class="hljs-string">"background-color"</span>, <span class="hljs-string">"blue"</span>).<span class="hljs-title function_">css</span>(<span class="hljs-string">"display"</span>, <span class="hljs-string">"block"</span>)
<span class="hljs-comment">//showImgBox();</span>
}
},
<span class="hljs-attr">error</span>: <span class="hljs-keyword">function</span> (<span class="hljs-params"></span>) {
<span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(<span class="hljs-string">"ERROR"</span>);
}
})
}
</span><span class="hljs-tag"></<span class="hljs-name">script</span>></span>
<span class="hljs-tag"></<span class="hljs-name">div</span>></span>
这个标签给的样式如下:
<span class="hljs-attribute">position</span>: fixed;
<span class="hljs-attribute">width</span>: <span class="hljs-number">100%</span>;
<span class="hljs-attribute">height</span>: <span class="hljs-number">100%</span>;
<span class="hljs-attribute">left</span>: <span class="hljs-number">0</span>;
<span class="hljs-attribute">top</span>: <span class="hljs-number">0</span>;
<span class="hljs-attribute">z-index</span>: <span class="hljs-number">999</span>;
<span class="hljs-attribute">background-image</span>: <span class="hljs-built_in">url</span>(<span class="hljs-string">'imgs/登录中.gif'</span>);
<span class="hljs-attribute">background-repeat</span>:no-repeat;
<span class="hljs-attribute">background-size</span>:auto;
<span class="hljs-attribute">background-position</span>:center;
<span class="hljs-attribute">margin</span>:<span class="hljs-number">0</span> auto;
<span class="hljs-attribute">background-color</span>:white;
<span class="hljs-attribute">opacity</span>:<span class="hljs-number">0.2</span>;
<span class="hljs-attribute">display</span>:none;
上面加粗的即是可以出来的,跟出不来的做个对比叭。 出不来的那个我同样一段,把加粗给换一下,代码如下:
<span class="hljs-tag"><<span class="hljs-name">div</span> <span class="hljs-attr">id</span>=<span class="hljs-string">"LoginAnimation"</span>></span><span class="hljs-tag"></<span class="hljs-name">div</span>></span>
<span class="hljs-tag"><<span class="hljs-name">div</span> <span class="hljs-attr">id</span>=<span class="hljs-string">"PostOut"</span> <span class="hljs-attr">class</span>=<span class="hljs-string">"haveRadious"</span>></span>
<span class="hljs-tag"><<span class="hljs-name">label</span> <span class="hljs-attr">id</span>=<span class="hljs-string">"label1"</span>></span>有什么新鲜事想告诉大家?<span class="hljs-tag"></<span class="hljs-name">label</span>></span>
<span class="hljs-tag"><<span class="hljs-name">textarea</span> <span class="hljs-attr">id</span>=<span class="hljs-string">"txtpost"</span> <span class="hljs-attr">cols</span>=<span class="hljs-string">"30"</span> <span class="hljs-attr">rows</span>=<span class="hljs-string">"10"</span> <span class="hljs-attr">maxlength</span>=<span class="hljs-string">"2000"</span> <span class="hljs-attr">class</span>=<span class="hljs-string">"PostText"</span> <span class="hljs-attr">runat</span>=<span class="hljs-string">"server"</span>></span><span class="hljs-tag"></<span class="hljs-name">textarea</span>></span>
<span class="hljs-tag"><<span class="hljs-name">div</span> <span class="hljs-attr">style</span>=<span class="hljs-string">"height: 0px; overflow: hidden; position: absolute;"</span>></span>
<span class="hljs-tag"></<span class="hljs-name">div</span>></span>
<span class="hljs-tag"><<span class="hljs-name">div</span> <span class="hljs-attr">style</span>=<span class="hljs-string">"display:inline-block;"</span> <span class="hljs-attr">id</span>=<span class="hljs-string">"imgbox"</span>></span>
<%--图片按钮--%>
<span class="hljs-tag"><<span class="hljs-name">asp:FileUpload</span> <span class="hljs-attr">ClientIDMode</span>=<span class="hljs-string">"Static"</span> <span class="hljs-attr">AllowMultiple</span>=<span class="hljs-string">"true"</span> <span class="hljs-attr">ID</span>=<span class="hljs-string">"fuGetimg"</span> <span class="hljs-attr">runat</span>=<span class="hljs-string">"server"</span> <span class="hljs-attr">onchange</span>=<span class="hljs-string">"document.getElementById('btnimg2').click();"</span> <span class="hljs-attr">Style</span>=<span class="hljs-string">"visibility: hidden; height: 0px; overflow: hidden; position: absolute;"</span> /></span>
<span class="hljs-tag"><<span class="hljs-name">input</span> <span class="hljs-attr">id</span>=<span class="hljs-string">"btngetImg"</span> <span class="hljs-attr">type</span>=<span class="hljs-string">"button"</span> <span class="hljs-attr">value</span>=<span class="hljs-string">"图片"</span> <span class="hljs-attr">class</span>=<span class="hljs-string">"btn_pad btn btn-info"</span> <span class="hljs-attr">onclick</span>=<span class="hljs-string">"document.getElementById('fuGetimg').click(),showimgchose()"</span> <span class="hljs-attr">title</span>=<span class="hljs-string">"选择你要分享发布的图片吧~"</span> /></span>
<span class="hljs-tag"><<span class="hljs-name">asp:Button</span> <span class="hljs-attr">ID</span>=<span class="hljs-string">"btnimg2"</span> <span class="hljs-attr">ClientIDMode</span>=<span class="hljs-string">"Static"</span> <span class="hljs-attr">runat</span>=<span class="hljs-string">"server"</span> <span class="hljs-attr">Style</span>=<span class="hljs-string">"visibility: hidden; height: 0px; overflow: hidden; position: absolute;"</span> <span class="hljs-attr">Text</span>=<span class="hljs-string">"Button"</span> <span class="hljs-attr">OnClick</span>=<span class="hljs-string">"btngetImg_Click"</span> /></span>
**<span class="hljs-tag"><<span class="hljs-name">div</span> <span class="hljs-attr">id</span>=<span class="hljs-string">"imgbox_hidden"</span>></span>
<span class="hljs-tag"></<span class="hljs-name">div</span>></span>**
<span class="hljs-tag"><<span class="hljs-name">script</span>></span><span class="language-javascript">
<span class="hljs-comment">// ajax提交图片后显示图片展示框</span>
<span class="hljs-keyword">function</span> <span class="hljs-title function_">showimgchose</span>(<span class="hljs-params"></span>) {
$.<span class="hljs-title function_">ajax</span>({
<span class="hljs-attr">url</span>: <span class="hljs-string">"AfterLoginIndex.aspx"</span>,
<span class="hljs-attr">type</span>: <span class="hljs-string">"Post"</span>,
<span class="hljs-attr">async</span>: <span class="hljs-literal">true</span>,
<span class="hljs-attr">beforeSend</span>: <span class="hljs-keyword">function</span> (<span class="hljs-params"></span>) {
$(<span class="hljs-string">"#LoginAnimation"</span>).<span class="hljs-title function_">show</span>()
},
<span class="hljs-attr">success</span>: <span class="hljs-keyword">function</span> (<span class="hljs-params">res</span>) {
<span class="hljs-keyword">if</span> (res == <span class="hljs-string">"true"</span>) {
<span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(<span class="hljs-number">123</span>)
<span class="hljs-title function_">alert</span>(<span class="hljs-number">123</span>)
$(<span class="hljs-string">"#LoginAnimation"</span>).<span class="hljs-title function_">hide</span>()
**$(<span class="hljs-string">"#imgbox_hidden"</span>).<span class="hljs-title function_">css</span>(<span class="hljs-string">"background-color"</span>, <span class="hljs-string">"blue"</span>).<span class="hljs-title function_">css</span>(<span class="hljs-string">"display"</span>, <span class="hljs-string">"block"</span>)**
<span class="hljs-comment">//showImgBox();</span>
}
},
<span class="hljs-attr">error</span>: <span class="hljs-keyword">function</span> (<span class="hljs-params"></span>) {
<span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(<span class="hljs-string">"ERROR"</span>);
}
})
}
</span><span class="hljs-tag"></<span class="hljs-name">script</span>></span>
<span class="hljs-tag"></<span class="hljs-name">div</span>></span>
这个标签对应的效果样式如下:
<span class="hljs-attribute">width</span>:<span class="hljs-number">300px</span>;
<span class="hljs-attribute">height</span>:<span class="hljs-number">300px</span>;
<span class="hljs-attribute">background-color</span>:red;
<span class="hljs-attribute">position</span>:absolute;
<span class="hljs-attribute">margin-left</span>:-<span class="hljs-number">105px</span>;
<span class="hljs-attribute">z-index</span>:<span class="hljs-number">800</span>;
<span class="hljs-attribute">box-shadow</span>:<span class="hljs-number">#808080</span> <span class="hljs-number">0px</span> <span class="hljs-number">0px</span> <span class="hljs-number">20px</span> <span class="hljs-number">6px</span>;
<span class="hljs-attribute">margin-top</span>:<span class="hljs-number">5px</span>;
<span class="hljs-attribute">overflow-y</span>:auto;
<span class="hljs-attribute">display</span>:none;
``` ,所有有关的代码,都列出来啦,我因为第一个成功的标签可以出来,所以感觉ajax请求是成功的,结果,我在里面写alert()是弹不出来的,写个console<span class="hljs-selector-class">.log</span>()打印照样没有出来,那么是说明它代码没有执行成功?我想不明白,为什么上面那个同样的可以正常去显示隐藏,然后我怀疑我的样式直接<span class="hljs-selector-class">.css</span>()参数给的有问题,$("#imgbox_hidden")<span class="hljs-selector-class">.css</span>("background-color", "blue")<span class="hljs-selector-class">.css</span>("display", "block")但这行代码,我直接写在$(function(){ })里,是有效果的,这就是我的问题了,感觉代码没有走进来,但是人家上面那个显示隐藏是可以实现的,其他弹框、打印、以及其他给的样式,都是没有效果。 后台的代码应该是没有多大影响的,依然列出来吧:
protected void btngetImg_Click(object sender, EventArgs e)
{
<span class="hljs-regexp">//</span> 测试同时选择多个文件
HttpFileCollection files = Request.Files;
<span class="hljs-regexp">//</span> 判断一次性选择的文件数量是否有且不大于<span class="hljs-number">9</span>个
<span class="hljs-keyword">if</span> (files.Count > <span class="hljs-number">0</span> && files.Count <= <span class="hljs-number">9</span> && fuGetimg.HasFile)
{
<span class="hljs-regexp">//</span> 判断是否已经上传过<span class="hljs-number">9</span>个
<span class="hljs-keyword">if</span> (upfilesCount>=<span class="hljs-number">8</span>)
{
Response.Write(<span class="hljs-string">"<script>alert('每次发布最多上传9个文件!')</script>"</span>);
return;
}
<span class="hljs-regexp">//</span> 循环中判断所有选择文件的类型,类型合法则放入数组,若有不合法的则清空
<span class="hljs-keyword">for</span> (int i = <span class="hljs-number">0</span>; i < files.Count-<span class="hljs-number">1</span>; i++)
{
HttpPostedFile fileitem = files[i];
<span class="hljs-regexp">//</span>获取后缀
string fix = fileitem.FileName.Substring(fileitem.FileName.LastIndexOf(<span class="hljs-string">'.'</span>) + <span class="hljs-number">1</span>).ToLower();
<span class="hljs-regexp">//</span>判断文件类型
<span class="hljs-regexp">//i</span>f (!(fix == <span class="hljs-string">"png"</span> || fix == <span class="hljs-string">"jpg"</span> || fix == <span class="hljs-string">"jpeg"</span> || fix == <span class="hljs-string">"pic"</span>))
<span class="hljs-regexp">//</span>{
<span class="hljs-regexp">//</span>Response.Write(<span class="hljs-string">"<script>alert('上传的文件中存在不是图片类型的文件,请重新选择文件!')</script>"</span>);
<span class="hljs-regexp">//</span> 重置下标
<span class="hljs-regexp">//u</span>pfilesCount = <span class="hljs-number">0</span>;
<span class="hljs-regexp">//</span> 重置数组
<span class="hljs-regexp">//</span> upfiles = new string[<span class="hljs-number">9</span>];<span class="hljs-regexp">//</span> 若循环以下标形式加入则无需重置数组
<span class="hljs-regexp">//</span>return;
<span class="hljs-regexp">//</span>}
<span class="hljs-regexp">//u</span>pfiles[upfilesCount] = fileitem.FileName;
<span class="hljs-regexp">//u</span>pfilesCount++;
}
<span class="hljs-regexp">//</span> 循环走过则所有文件格式判断完毕\
<span class="hljs-regexp">//</span> 此处不能使用数组方式上传,数组上传的仅是第一个文件,
<span class="hljs-regexp">//</span> 因此再次使用 HttpFileCollection 进行写入
<span class="hljs-keyword">for</span> (int i = <span class="hljs-number">0</span>; i < Request.Files.Count-<span class="hljs-number">1</span>; i++)
{
string newfilename = fuGetimg.FileName;
string fixs=newfilename.Substring(newfilename.LastIndexOf(<span class="hljs-string">'.'</span>) + <span class="hljs-number">1</span>).ToLower();
newfilename= Guid.NewGuid().ToString() + <span class="hljs-string">"."</span> + fixs;
Request.Files[i].SaveAs(Server.MapPath(<span class="hljs-string">"postupimg/"</span>) + newfilename);
}
Response.Pics(<span class="hljs-string">"true"</span>);
}
```
求大神帮助哇,救救孩子吧,呜呜呜~~