如何使用Javascript在html源中添加动态数据

How to add dynamic data in source of html using Javascript

本文关键字:添加 动态 数据 html 何使用 Javascript      更新时间:2023-09-26

我使用的是一个简单的Javascript切换函数,包含以下代码。

<script>
function add_more(){
if (document.form.more[0].checked==true)
{
document.getElementById('moreTxt').style.display="block";
}
else if (document.form.more[1].checked==true)
{
document.getElementById('moreTxt').style.display="none";
}
}
</script>

do want to enter something more ? 
<form name="form">
<input type="radio" value="yes" name="more" onclick="add_more()" /> Yes
<input type="radio" value="No" name="more" onclick="add_more()" /> No
<div id="moreTxt" style="display:none">
hi you can enter more here 
<textarea rows="3" cols="4">
</textarea>
</div>
</form>

问题是,如果我单击"是",出于某种原因刷新页面,则"是"单选按钮将保持选中状态,但moreTxt div将隐藏(即其默认可视模式)。

我应该如何解决这个问题?

检查文档就绪上控件的值,并相应地调整div可见性。

这将在加载时重置所有输入:

<script>
function resetChkBox() {
    var e=document.getElementsByTagName('input');
    var i=0;
    while(i<e.length) {
        if(e[i++].type=='radio') {
            e[i].checked=false;
        }
    }
}
</script>

  <body onload="resetChkBox()">

您应该在DucomentReady上执行add_more函数假设您使用的是jquery:

       $(document).ready(function() {
         add_more(); 
       }
       )

或者使用相当于document.ready()的纯javascript

如果这是在没有jquery的情况下执行的,应该是这样的,因为为这么小的事情包括jquery将是过度的:

document.attachEvent("onDOMContentLoaded", function(){
    ready()
  });

在就绪功能中,检查单选按钮的值。