OnClick僅運行一次

Question

我有一個非常簡單的代碼，用於切換textareas的內容可見性，第一個擴展textarea以顯示整個內容，第二個將其返回到以前的大小並顯示滾動條。 兩個按鈕在第一次運行時都工作正常，但此后什么也沒做，就我所知，沒有任何錯誤，我想在這里進行操作以使兩個按鈕在首次運行后都能正常工作

<button
onclick='document.getElementById("input0").style.overflow="visible";
        document.getElementById("kpi1").style.overflow="visible";
        document.getElementById("m_kpi1").style.overflow="visible";
        document.getElementById("g_kpi1").style.overflow="visible"'
></button>

<button 
onclick='document.getElementById("input0").style.overflowY="scroll";
        document.getElementById("kpi1").style.overflowY="scroll";
        document.getElementById("m_kpi1").style.overflowY="scroll";
        document.getElementById("g_kpi1").style.overflowY="scroll"'
></button>

Answer 1

因為兩個按鈕都設置了不同的屬性，並且一旦將其設置，就無法將其重置，因此，如果要在單擊第二個按鈕時還原第一個按鈕的設置，它將起作用。

嘗試：

<button
onclick='document.getElementById("input0").style.overflow="visible";
        document.getElementById("kpi1").style.overflow="visible";
        document.getElementById("m_kpi1").style.overflow="visible";
        document.getElementById("g_kpi1").style.overflow="visible"'
></button>

<button 
onclick='document.getElementById("input0").style.overflow="scroll";
        document.getElementById("kpi1").style.overflow="scroll";
        document.getElementById("m_kpi1").style.overflow="scroll";
        document.getElementById("g_kpi1").style.overflow="scroll"'
></button>

一個建議在函數中添加JavaScript代碼，然后在onclick中調用它。

function setOverflow(value){
  document.getElementById("input0").style.overflow=value;
  document.getElementById("kpi1").style.overflow=value;
  document.getElementById("m_kpi1").style.overflow=value;
  document.getElementById("g_kpi1").style.overflow=value;
}

和html：

<button onclick='setOverflow("scroll")'>scroll</button>
<button onclick='setOverflow("visible")'>visible</button>