javascript colspanは動的にセルを削除しますか？

Question

誰も私のコードで私を助けることができますか？ 次のアクションでサンプルコードを作成しようとしています。 1.ユーザーがボタンをクリックすると、「hello」はセル1とセル2になり、もう一方のセル3~10は残ります。 2.ユーザーがボタンを再度クリックすると、何も起こりません。

ユーザーが再度クリックすると何も起こらないようにするには、ユーザーがクリックした後にフラグをfalseに設定しようとします。しかし、それはまったく動作しません。ユーザーは最初の行のセルが削除されるまで「hello」をクリックすることができます。

javascriptまたはJQueryの任意のソリューションですか？私はjavascriptで静的変数を検索しようとするが、不可能と思われる。

ありがとうございます。

var flag = false; 
function clickhere(){ 
    if(flag = true){ 
     var cell = document.getElementById('a'); 
     document.getElementById("row").deleteCell(1); 
     cell.setAttribute("colspan", 2); 
     cell.innerHTML = "hello"; 
     flag=false; 
    } 
} 

<table border="1"> 
    <tr id="row"> 
     <td id="a">1</td> 
     <td id="b">2</td> 
     <td id="c">3</td> 
     <td id="d">4</td> 
     <td id="e">5</td> 
    </tr> 
    <tr> 
     <td id="f">6</td> 
     <td id="g">7</td> 
     <td id="h">8</td> 
     <td id="i">9</td> 
     <td id="j">10</td> 
    </tr> 
</table> 
<input type="button" value="Click" onclick="clickhere();"/> 

Answer 1

あなたは対処する機会のカップルを持っています。まず、が比較ではなく割り当てを行っている場合はです。 フラグはブール値なので、直接使用することができます。第二に、あなたの最初の割り当てと関数の終わりにあるものは、おそらく反対であるべきです。

ここでは、訂正する方法の1つです。

var flag = false; 
 
function clickhere(){ 
 
    if(flag){ return; } 
 
    flag = true; 
 

 
    var cell = document.getElementById('a'); 
 
    document.getElementById("row").deleteCell(1); 
 
    cell.setAttribute("colspan", 2); 
 
    cell.innerHTML = "hello"; 
 
}

<table border="1"> 
 
    <tr id="row"> 
 
    <td id="a">1</td> 
 
    <td id="b">2</td> 
 
    <td id="c">3</td> 
 
    <td id="d">4</td> 
 
    <td id="e">5</td> 
 
    </tr> 
 
    <tr> 
 
    <td id="f">6</td> 
 
    <td id="g">7</td> 
 
    <td id="h">8</td> 
 
    <td id="i">9</td> 
 
    <td id="j">10</td> 
 
    </tr> 
 
</table> 
 
<input type="button" value="Click" onclick="clickhere();" />