当回发发生时，我的所有div标签都在闪烁，我们怎么能停止闪烁 [英] When postback happens my all div tags are flickering,How can we stop flickering
本文介绍了当回发发生时，我的所有div标签都在闪烁，我们怎么能停止闪烁的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
嗨开发者，
例如，在我的网络应用程序中，
我使用3滑动div标签，每个div包含一些控件。当回发后发生所有的div都闪烁和闪烁。
在第3个div（Flip2）里面我正在使用check框。当我选中整个页面的复选框并且所有3个div闪烁并闪烁。
请在下面查看我的代码为aspx：
Hi Developers,
For example, In my web application,
I am using 3 Sliding div tags, each div contains some controls.When post back happens all the divs are flickering and flashing.
In the 3rd div(Flip2) inside I am using check box. When I select the check box entire page and all 3 divs flickered and flashing.
Please check below my code for aspx:
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
<script src="Scripts/jquery.min.js" type="text/javascript"></script>
<script src="Scripts/jquery-1.8.2.min.js" type="text/javascript"></script>
<link href="Styles/StyleSheet1.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="Styles/html2canvas.js"></script>
<script type="text/javascript" language="javascript">
function warningMessage(FirstCanvas, FirstGrid, FirstHiddenField, SecondCanvas, SecondGrid, SceondHiddenField) {
warningMessage1(FirstCanvas, FirstGrid, FirstHiddenField);
warningMessage2(SecondCanvas, SecondGrid, SceondHiddenField);
}
function warningMessage1(FirstCanvas, FirstGrid, FirstHiddenField) {
var canvas1 = document.getElementById(FirstCanvas);
html2canvas(document.getElementById(FirstGrid), {
onrendered: function (canvas1) {
document.body.appendChild(canvas1);
var image = canvas1.toDataURL("image/png");
image = image.replace('data:image/png;base64,', '');
document.getElementById(FirstHiddenField).value = image;
}
});
}
function warningMessage2(SecondCanvas, SecondGrid, SceondHiddenField) {
var canvas2 = document.getElementById(SecondCanvas);
html2canvas(document.getElementById(SecondGrid), {
onrendered: function (canvas2) {
document.body.appendChild(canvas2);
var image1 = canvas2.toDataURL("image/png");
image1 = image1.replace('data:image/png;base64,', '');
document.getElementById(SceondHiddenField).value = image1;
}
});
}
$("document").ready(function () {
if ($("#HiddenField1").val() == "block") {
$("#sliderDiv").css("display", "none");
}
if ($("#HiddenField1").val() == "none") {
$("#sliderDiv").css("display", "block");
}
$("#flip").click(function () {
$("#sliderDiv2").slideUp("slow");
$("#sliderDiv").slideToggle("slow");
$("#sliderDiv1").slideUp("slow");
});
});
$("document").ready(function () {
if ($("#HiddenField2").val() == "block") {
$("#sliderDiv1").css("display", "none");
}
if ($("#HiddenField2").val() == "none") {
$("#sliderDiv1").css("display", "block");
}
$("#flip1").click(function () {
$("#sliderDiv").slideUp("slow");
$("#sliderDiv2").slideUp("slow");
$("#sliderDiv1").slideToggle("slow");
});
});
$("document").ready(function () {
if ($("#HiddenField3").val() == "block") {
$("#sliderDiv2").css("display", "none");
}
if ($("#HiddenField3").val() == "none") {
$("#sliderDiv2").css("display", "block");
}
$("#flip2").click(function () {
$("#sliderDiv").slideUp("slow");
$("#sliderDiv1").slideUp("slow");
$("#sliderDiv2").slideToggle("slow");
});
});
$(function () {
var currentPosition = 0;
var slideWidth = 1200;
var slides = $('.slide');
var numberOfSlides = slides.length;
slides.wrapAll('<div id="slidesHolder"></div>')
slides.css({ 'float': 'left'
});
$('#slideshow').prepend('<span class="nav" id="leftNav">Move Left</span>')
.append('<span class="nav" id="rightNav">Move Right</span>');
$('.nav').bind('click', function () {
if (($(this).attr('id') == 'rightNav')) {
if (currentPosition == 0) {
currentPosition = currentPosition + 1
}
else if (currentPosition == 1) {
currentPosition = currentPosition + 1
}
else if (currentPosition == 2) {
currentPosition = 0
}
}
if (($(this).attr('id') == 'leftNav')) {
if (currentPosition == 0) {
currentPosition = currentPosition + 2
}
else if (currentPosition == 1) {
currentPosition = currentPosition - 1
}
else if (currentPosition == 2) {
currentPosition = currentPosition - 1
}
}
moveSlide();
});
function moveSlide() {
$('#slidesHolder').animate({ 'marginLeft': slideWidth * (-currentPosition) });
};
});
</script>
<style type="text/css">
#flip
{
padding:5px;
text-align:center;
border:solid 1px #c3c3c3;
}
#flip1
{
padding:5px;
text-align:center;
border:solid 1px #c3c3c3;
}
#flip2
{
padding:5px;
text-align:center;
border:solid 1px #c3c3c3;
}
#slideshow {
position: relative;
}
#slideshow #slideshowWindow {
height: 540px;
margin: 0;
overflow: hidden;
padding: 0;
position: relative;
width: 1200px;
left:30px;
}
#slideshow #slideshowWindow .slide {
height: 540px;
margin: 0;
padding: 0;
position: relative;
width: 1200px;
}
#slideshow #slideshowWindow .slide .slideText a:link, #slideshow #slideshowWindow .slide .slideText a:visited {
color: #FFFFFF;
text-decoration: none;
}
#slideshow #slideshowWindow .slide .slideText h2, #slideshow #slideshowWindow .slide .slideText p {
color: #FFFFFF;
margin: 10px 0 0 10px;
padding: 0;
}
.nav
{
display:block;
text-indent:-10000px;
position:absolute;
cursor:pointer;
}
#leftNav
{
background-position: left;
top: 290px;
left:-4px;
width: 50px;
height: 120px;
background-image: url('../Images/icon-slide-arrow-right.png');
background-repeat: no-repeat;
z-index: 999;
}
#rightNav
{
background-position: right;
top:290px;
left:1215px;
width:50px;
height:120px;
background-image: url('../Images/icon-slide-arrow-leftt.png');
background-repeat:no-repeat;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<div style="height: auto; width: auto; background-color: White;">
<div id="flip" style="background-color: #0082AA; color: #FFFFFF;">
Filters</div>
<div id="sliderDiv" style="width: 100%; height: 700px;">
This is Control sliding Panel.
<asp:Button ID="button1" runat="server" Text="Postback" onclick="button1_Click"/>
<asp:RadioButton ID="RadioButton1" runat="server" AutoPostBack="True"
oncheckedchanged="RadioButton1_CheckedChanged" />
</div>
<div id="flip1" style="background-color: #0082AA; color: #FFFFFF;">
Map and Chart</div>
<div id="sliderDiv1" style="width: 100%; height: 700px;">
This is Control sliding Panel.
<asp:Button ID="button2" runat="server" Text="SecondButton"
onclick="button2_Click"/>
</div>
<div id="flip2" style="background-color: #0082AA; color: #FFFFFF;">
Report</div>
<div id="sliderDiv2" style="width: 100%; height: 700px;">
<asp:CheckBox ID="CheckBox1" runat="server" AutoPostBack="True"
oncheckedchanged="CheckBox1_CheckedChanged" />
<asp:Button ID="Button3" runat="server" onclick="Button3_Click" Text="Button"
Visible="False" />
<div id="slideshow">
<div id="slideshowWindow">
<div class="slide">
<asp:GridView ID="grvMergeHeader" runat="server"
ForeColor="White" Font-Names="Arial" Font-Size="10pt" GridLines="None">
</asp:GridView>
</div>
<div class="slide">
<asp:GridView ID="gridreport2" runat="server" ForeColor="White" Font-Names="Arial" Font-Size="10pt" GridLines="none">
</asp:GridView>
</div>
<div class="slide">
<img src="slideshow/slide3.jpg" />
</div>
</div>
</div>
</div>
</div>
<canvas id="myCanvas" runat="server" width="200" height="200" hidden="hidden"></canvas>
<asp:HiddenField ID="hdnResultValue" Value="Hie." runat="server"/>
<canvas id="myCanvas1" runat="server" width="200" height="200" hidden="hidden"></canvas>
<asp:HiddenField ID="hdnResultValue1" Value="Hie." runat="server"/>
<asp:HiddenField ID="HiddenField1" runat="server" Value="block"/>
<asp:HiddenField ID="HiddenField2" runat="server" Value="block"/>
<asp:HiddenField ID="HiddenField3" runat="server" Value="block"/>
</div>
</form>
</body>
</html>
And My C# code here:
And My C# code here:
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
DataTable dt = new DataTable("RunnerUp");
DataColumn dc1 = new DataColumn("Name", typeof(string));
DataColumn dc2 = new DataColumn("Points", typeof(int));
dt.Columns.Add(dc1);
dt.Columns.Add(dc2);
DataRow dr1 = dt.NewRow();
dr1[0] = "Vulpes";
dr1[1] = 235;
DataRow dr2 = dt.NewRow();
dr2[0] = "SP Nayak";
dr2[1] = 135;
DataRow dr3 = dt.NewRow();
dr3[0] = "Krishna";
dr3[1] = 40;
dt.Rows.Add(dr1);
dt.Rows.Add(dr2);
dt.Rows.Add(dr3);
gridreport2.DataSource = dt;
gridreport2.DataBind();
grvMergeHeader.DataSource = dt;
grvMergeHeader.DataBind();
}
}
protected void button1_Click(object sender, EventArgs e)
{
HiddenField1.Value = "block";
}
protected void RadioButton1_CheckedChanged(object sender, EventArgs e)
{
HiddenField1.Value = "none";
}
protected void button2_Click(object sender, EventArgs e)
{
HiddenField2.Value = "block";
HiddenField1.Value = "block";
}
protected void CheckBox1_CheckedChanged(object sender, EventArgs e)
{ if (CheckBox1.Checked)
{
string FirstCanvas = myCanvas.ID;
string FirstGrid = grvMergeHeader.ID;
string FirstHiddenField = hdnResultValue.ID;
string SecondCanvas = myCanvas1.ID;
string SecondGrid = gridreport2.ID;
string SceondHiddenField = hdnResultValue1.ID;
Page.ClientScript.RegisterStartupScript(this.GetType(), "jhfgd", "warningMessage('" + FirstCanvas + "','" + FirstGrid + "','" + FirstHiddenField + "','" + SecondCanvas + "','" + SecondGrid + "','" + SceondHiddenField + "');", true);
Button3.Visible=true;
//HiddenField1.Value = "block";
//HiddenField2.Value = "block";
HiddenField3.Value = "none";
}
else
{
//
}
}
Kindly provide me your ideas.
Kindly provide me your ideas.
推荐答案
(\"document\").ready(function () {
if (
("document").ready(function () { if (
(\"#HiddenField1\").val() == \"block\") {
("#HiddenField1").val() == "block") {
(\"#sliderDiv\").css(\"display\", \"none\");
}
if (
("#sliderDiv").css("display", "none"); } if (
这篇关于当回发发生时，我的所有div标签都在闪烁，我们怎么能停止闪烁的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
