HTML表和JavaScript

是否可以刪除表中的數據並用JavaScript代替新數據？例如，您在表格和文字下方顯示文字，您會看到一個按鈕，顯示「參加測驗」，點擊該按鈕後文字消失，測驗出現。然後，在參加測驗並點擊提交按鈕之後，測驗會消失，並顯示一條感謝信息。我試圖找出一種方法來保持用戶在同一頁面上。我附上了截圖，希望能夠幫助解釋我正在談論的內容。HTML表和JavaScript

Quiz

<table width="1280" height="1024" border="0" align="center" cellpadding="0" cellspacing="0" id="Table_01"> 
    <tr> 
     <td colspan="3"> 
     <img src="images/asdfasd.gif" width="1280" height="239" alt=""></td> 
     </tr> 
    <tr> 
     <td rowspan="2"> 
     <img src="images/asdf02.gif" width="110" height="785" alt=""></td> 
     <td><div id="vsp_copy"><table width="1045" border="0"> 
    <tr> 
    <td height="543" ><h2>VIDEO: THE REAL COST </h2> 
    <iframe width="600" height="360" src="http://www.youtube.comdfas?rel=0" frameborder="0" allowfullscreen></iframe></td> 
    <td><h2>sdfasdf</h2> 
     <h2>asdfa</h2> 
     <h2>asdf</h2> 
     <p>asdf </p> 
     <p>asdf</p> 
     <p>asdf </p> 
     <p>asdf</p> 
     <p>adfsdf</p> 
     <p><img src="images/asdfas.gif" width="357" height="37"></p></td> 
    </tr> 
</table>

來源

2012-06-20 Tobias

是的，這是可能的。你需要操縱DOM。 – bfavaretto

使用api.jquery.com/replaceWith/，如果您有純HTML代碼，我可以展示如何更換！ –

順便說一句，這是一個 - 採取調查和得到一個禮物騙局？：P –

是的，有可能這樣做。一個簡單的例子：

<div id="welcome">Welcome to quiz <button id="begin">Start</button></div> 
<div id="quiz"> 
    Question1:.... <br/> 
    Question2:.... <br/> 
    <button id="submit">Submit</button> 
</div> 
<div id="thanks">Thank you for taking the quiz</div>

你的CSS看起來類似：

#quiz, #thanks { display: none; }

你的jQuery：

$("#begin").click(function(){ 
    $("#quiz").show(); 
    $("#welcome").hide();  
}); 
$("#submit").click(function(){ 
    $("#thanks").show(); 
    $("#quiz").hide();  
});

這只是一個簡單的例子，但我想在這裏交流是你如何操縱DOM來獲得你想要的效果。

來源

2012-06-20 18:16:46

http://stackoverflow.com/a/2826810/871050 –

感謝這工作得很好！ – Tobias

你所談論的是Javascript的最大的問題之一，所以是的，這是可能的。

的JavaScript能夠操作DOM元素和自己的風格，因此，例如，如果你想隱藏的元素，你只需要：

document.getElementById(id).style.display = 'none';

想學習JavaScript？ Start here

來源

2012-06-20 18:16:13

jQuery使得像replaceWith()這樣的方法很容易，但jQuery絕對不是必需的。

這是經典的DOM操作。 Here's an example其中文本「之前」被div results div中的after取代。

var node = document.createTextNode('After') //create a new text node 
var el = document.getElementById('result') //get existing element 
el.innerHTML = ''; //clear inner contents 
el.appendChild(node) //append new text node

來源

2012-06-20 18:17:14 buley

HTML表和JavaScript

回答

相關問題