Tôi có trang ASP.NET có nút asp: không hiển thị. Tôi không thể biến nó hiển thị bằng JavaScript vì nó không được hiển thị trên trang.Thay đổi mức hiển thị của nhãn ASP.NET bằng JavaScript
Tôi có thể làm gì để giải quyết vấn đề này?
Tôi có trang ASP.NET có nút asp: không hiển thị. Tôi không thể biến nó hiển thị bằng JavaScript vì nó không được hiển thị trên trang.Thay đổi mức hiển thị của nhãn ASP.NET bằng JavaScript
Tôi có thể làm gì để giải quyết vấn đề này?
Nếu bạn cần thao tác nó ở phía máy khách, bạn không thể sử dụng thuộc tính Có thể nhìn thấy ở phía máy chủ. Thay vào đó, đặt kiểu hiển thị CSS thành "none". Ví dụ:
<asp:Label runat="server" id="Label1" style="display: none;" />
Sau đó, bạn có thể làm cho nó có thể nhìn thấy trên các mặt hàng với:
document.getElementById('Label1').style.display = 'inherit';
Bạn có thể làm cho nó ẩn một lần nữa với:
document.getElementById('Label1').style.display = 'none';
Hãy ghi nhớ rằng có có thể là vấn đề với ClientID phức tạp hơn "Label1" trong thực tế. Bạn sẽ cần phải sử dụng ClientID với getElementById, không phải ID phía máy chủ, nếu chúng khác nhau.
Nếu bạn đợi cho đến khi trang được tải, và sau đó đặt hiển thị của nút thành không, điều đó sẽ hoạt động. Sau đó, bạn có thể làm cho nó có thể nhìn thấy ở một điểm sau đó.
Đảm bảo thuộc tính Hiển thị được đặt thành true hoặc điều khiển sẽ không hiển thị cho trang. Sau đó, bạn có thể sử dụng kịch bản để thao tác nó.
Hãy thử điều này.
<asp:Button id="myButton" runat="server" style="display:none" Text="Click Me" />
<script type="text/javascript">
function ShowButton() {
var buttonID = '<%= myButton.ClientID %>';
var button = document.getElementById(buttonID);
if(button) { button.style.display = 'inherit'; }
}
</script>
Không sử dụng mã phía máy chủ để thực hiện việc này vì yêu cầu đăng lại. Thay vì sử dụng Visibility = "false", bạn chỉ có thể đặt thuộc tính CSS ẩn nút. Sau đó, trong javascript, hãy chuyển thuộc tính đó trở lại bất cứ khi nào bạn muốn hiển thị lại nút.
ClientID được sử dụng vì nó có thể khác với ID máy chủ nếu nút nằm bên trong điều khiển Vùng chứa tên. Chúng bao gồm Panels của các loại khác nhau.
Tiếp tục với những gì Dave Phường nói:
thiết kế trang/Control
<asp:Label runat="server" ID="Label1" Style="display: none;" />
<asp:Button runat="server" ID="Button1" />
Mã đằng sau
Một nơi nào đó trong phần tải:
Label label1 = (Label)FindControl("Label1");
((Label)FindControl("Button1")).OnClientClick = "ToggleVisibility('" + label1.ClientID + "')";
Javascript nộp
function ToggleVisibility(elementID)
{
var element = document.getElementByID(elementID);
if (element.style.display = 'none')
{
element.style.display = 'inherit';
}
else
{
element.style.display = 'none';
}
}
Tất nhiên, nếu bạn không muốn để chuyển đổi nhưng chỉ để hiển thị các nút/nhãn sau đó điều chỉnh phương pháp javascript cho phù hợp.
Điểm quan trọng ở đây là bạn cần gửi thông tin về ClientID
của điều khiển mà bạn muốn thao tác ở phía máy khách vào tệp javascript hoặc đặt biến chung hoặc thông qua hàm tham số như trong ví dụ của tôi.
Bạn cần phải cảnh giác với XSS khi đang làm công cụ như thế này:
document.getElementById('<%= Label1.ClientID %>').style.display
Các cơ hội được rằng không ai sẽ có thể làm xáo trộn các ClientID của Label1 trong trường hợp này, nhưng chỉ để được ở ở bên an toàn bạn có thể muốn vượt qua nó là giá trị thông qua một trong những phương pháp AntiXss library's:
document.getElementById('<%= AntiXss.JavaScriptEncode(Label1.ClientID) %>').style.display
Đây là cách đơn giản nhất tôi tìm thấy:
BtnUpload.Style.Add("display", "none");
FileUploader.Style.Add("display", "none");
BtnAccept.Style.Add("display", "inherit");
BtnClear.Style.Add("display", "inherit");
Tôi có điều ngược lại ở Khác, do đó, nó cũng xử lý hiển thị chúng. Điều này có thể đi vào Tải của Trang hoặc trong một phương thức để làm mới các điều khiển trên trang.