Есть ли все-таки, чтобы скрыть div в файле ascx?

Question

У меня есть <div> в файле ASCX:

<div id="chart_div1" style="width: 900px; height: 500px;"></div> 

Есть ли способ, я могу нажать на кнопку, как:

<input id="Button29" type="button" value="Hide It!" onclick="dosomething" /> 

так, что каждый раз, когда я нажимаю на эту кнопку, она будет скрывать DIV выше ? Но я не хочу использовать код, чтобы это произошло, потому что если я включу runat="server" в мой <div>, он не сможет загрузить в него точку графика Google. (Pls refer to this post for better understanding)

Итак, каким-либо образом я могу скрыть свой div при нажатии этой кнопки без изменения моего <div>?

Answer 1

Для решения этой проблемы вы можете использовать HTMLElement.style api, а также установить свойство display, как вы пожелаете.

первый: получить DIV с id="chart_div1" - document.getElementById('chart_div1')
второй: установить свойство дисплея - document.getElementById('chart_div1').style.display='value', где value из списка допустимых значений.

none | inline | блок | список | встроенный блок | встроенный стол | стол | настольная ячейка | стол-стол | table-column-group | table-footer-group | table-header-group | стол-строка | table-row-group | flex | inline-flex | сетка | встроенная сетка | обкатку

для добавления встроенных JS в HTML с использованием протокола "JavaScript:"
так и для скрытия DIV вам нужно добавить onclick

<input ... onclick="javascript:document.getElementById('chart_div1').style.display='none'" /> 

для шоу - этот

<input ... onclick="javascript:document.getElementById('chart_div1').style.display='block'" />