Проблема с отображением / скрытием элементов пользовательского интерфейса в HTML

Question

Проблема с отображением / скрытием элементов пользовательского интерфейса в HTML

Это шаблон конструктора функций, он используется для создания объектов.

   
const Juice = function(juice) {
      this.juice = juice;
}
const appleJuice = new Juice('apple');
console.log(appleJuice.juice); // apple

const orangeJuice = new Juice('orange');
console.log(orangeJuice.juice); // orange

В резюме вы используете конструктор функции для создания новый объект со значением, указывающим на вновь созданный объект. Вы можете создать несколько экземпляров объекта (appleJuice, orangeJuice), но каждый экземпляр может иметь собственные значения свойств (apple или orange)

Проверить этот учебник

1

html javascript

задан j08691 18 January 2019 в 20:02

4 ответа

Другие вопросы по тегам:

html javascript

Похожие вопросы:

score 0 · Answer 1

Это может быть то, что вы ищете. Он держит кнопку в том же месте.

HTML

<input id="Button" type="button" onclick="showHide('UI');" value="Show UI" />
<div id="UI" style="visibility: hidden">
    <p> Various UI goes here</p>
</div>
<p id="status">Start</p>

JS

function showHide(UI) {
  if (document.getElementById(UI).style.visibility === 'hidden') {
    document.getElementById("status").innerHTML = "Shown";
    document.getElementById(UI).style.visibility = "visible";
    document.getElementById('Button').value = 'Hide UI'
  } else {
    document.getElementById("status").innerHTML = "Hidden";
    document.getElementById(UI).style.visibility = "hidden";
    document.getElementById('Button').value = 'Show UI'
  }

score 0 · Answer 2

Вам просто нужно вызвать функцию один раз в скрипте. Смотри код ниже, я позвонил showHide('show', 'hideUI'); сразу после объявления функции.

function showHide(thingToHide, thingToShow) {
  document.getElementById("status").innerHTML = "Shown";
  if (thingToHide == "showUI") {
    document.getElementById("status").innerHTML = "Hidden";
  }
  document.getElementById(thingToHide).style.visibility = "hidden";
  document.getElementById(thingToShow).style.visibility = "visible";
}
showHide('showUI', 'hideUI');

<div id="hideUI">
  <input id="showButton" type="button" onclick="showHide('hideUI', 'showUI');" value="Show UI" />
</div>

<div id="showUI">
  <input id="hideButton" type="button" onclick="showHide('showUI', 'hideUI');" value="Hide UI" />
  <p> Various UI goes here</p>
</div>
<p id="status">Start</p>

score 0 · Answer 3

Проблема с моим исходным кодом заключается в том, что функция javascript ДО ПЕРЕД div. Если я устанавливаю видимость div showUI скрытым в HTML и перемещаю javascript после HTML для div, он работает как нужно.

score 0 · Answer 4

Вам необходимо выполнить showHide ('hideUI', 'showUI'); при загрузке страницы. Следующий Javascript должен работать:

function showHide(thingToHide, thingToShow) {
  document.getElementById("status").innerHTML = "Shown";
  if (thingToHide == "showUI") {
    document.getElementById("status").innerHTML = "Hidden";
  }
  document.getElementById(thingToHide).style.visibility = "hidden";
  document.getElementById(thingToShow).style.visibility = "visible";
}
showHide('hideUI', 'showUI');