在html中能否用js调用另一个html~~o(>_<)o ~~

暂且定这页面叫edit.html ：<div id="txtEdit">
<div id="show"></div>
  <div id="editMenu">
  <input name="pic" type="button" id="pic" class="btn" value="图片" onclick="danji(this);" />
  <input name="video" type="button" id="video" class="btn"  value="视频" onclick="danji(this);" />
  <input name="link" type="button" id="link" class="btn"  value="链接" onclick="danji(this);"/>
  <input name="bold" type="button" id="bold" class="btn"  value="B" onclick="danji(this);"/>
  <input name="fontB_S" type="button" id="fontB_S" class="btn"  value="A" onclick="danji(this);"/>
  <input name="italic" type="button" id="italic" class="btn"  value="I" onclick="danji(this);"/>
  <input name="underLine" type="button" id="underLine" class="btn"  value="U" onclick="danji(this);"/>
  <input name="chooseColor" type="button" id="chooseColor" class="btn"  value="颜色" onclick="chooseColor();" />
  <input name="setLeft" type="button" id="setLeft" class="btn"  value="居左" onclick="danji(this);"  />
  <input name="setCenter" type="button" id="setCenter"  class="btn" value="居中" onclick="danji(this);"/>
  <input name="setRight" type="button" id="setRight" class="btn"  value="居右"  onclick="danji(this);"/>
     <input name="showface" type="button" id="showface" class="btn" value="表情" onclick="chooseFace();" />
  </div>
<div id="txtField">
<form id="form1" name="form1" method="post" action="textChange.html" onsubmit="f();">
  <textarea name="txt"  id="txt" class="txtEdit" ></textarea>
  <br />
 <input name="btnSubmit" type="image" value="提交" src="image/btnSubmit.gif" onclick="this.form.submit();" />&nbsp;&nbsp;
<input name="btnReset" type="image" value="重写" src="image/btnReset.gif" onclick="this.form.reset(); return false;" />
</form>
</div>
</div>这是我在edit.html里面写的一段算简单的文本编辑器吧，当然其中引入了js文件和css文件，功能都是可以的。我想问下，能不能在另一个静态页面（比如1.html）中，用JavaScript引用这个页面来替换1.html页面中的文本域textarea？还是我需要把这个edit.html改成js文件，再在1.html中调用

解决方案 »

  1.   

    方法一
    1.将edit.html里面用的js和css文件在1.html中引入
    2.通过Ajax获取edit.html的内容，然后赋予1.html中的某个DOM的innerHTML
    3.注意id之类的不要冲突
    方法二
    将edit.html页面的里的html内容通过js动态生成，并提供接口，这样1.html只要引入js文件和css文件并调用那个接口在指定位置生成简单的文本编辑器就好了
      

  2.   

    Ajax不太会。 如果改成js的话，怎么提供接口呢？
      

  3.   

    1.html页面中包含<a href="edit.html" id="box">
          </a>$('#box').click(function(){
        
        $.post('edit.html',function(){        $('#box').html(data);       }
       )})
      

  4.   

    上面的JS，需要引入jquery改了一点点$('#box').click(function(){
       
      $.post('edit.html',function(){  $('#box').html(data);  }
      )  return false; //阻止浏览器默认动作，就是阻止链接跳转})
      

  5.   

    楼上的例子好像是链接到了edit.html啊。我是想要把1.html上的textarea文本域用edit.html上的内容替换掉。
      

  6.   

    是 异步加载就是 ajax 效果不是链接<a href="edit.html" id="box">
       
        <textarea />....</a>
      

  7.   

    谢谢啊，不过好像不是我想要的效果。
    1.html里类似是：<input type="text" name="title" /><br />
    <textarea name="content" rows="5" cols="25"></textarea>如果按楼上的话，第一个text就没有了。而且我只需要把第二个textarea替换掉
      

  8.   

    首先把edit.html以iframe形式嵌入1.html，然后获得
    extarea的id（就是引用假设叫做area）和iframe的id(假设叫做edit)
    在1.html使用document.getElementById("area").value=document.getElementById("edit").contentWindow.document.body.innerHTML;
    就可以把1.html上的textarea文本域用edit.html上的内容替换掉。楼主做的好像是聊天功能啊。
    个人猜测。
      

  9.   

    呵呵~算是吧，就类似帖子下方的回复内容区域。
    <body><script language="JavaScript" type="text/javascript">
    document.getElementById("area").value=document.getElementById("edit").contentWindow.document.body.innerHTML;
    </script><input type="text" name="title" /><br /><textarea name="content" rows="5" cols="25" id="area"></textarea>
    <iframe src="textChange.html" id="edit"></iframe>//这边怎么弄啊？</body>
    能详细点吗
      

  10.   

    我晕！！！
    这样就可以了啊！！！
    只要你的textChange.html有内容就可以了啊！！！
      

  11.   

    额~
    明显不是取代啊~ 
    是textarea旁边有个iframe，iframe调出textChange.html的内容啊~
      

  12.   


    <body><input type="text" name="title" /><br />
    <input type="button" value="test" onclick="tihuan();"/><br />
    <textarea name="content" rows="5" cols="25" id="area"></textarea><br />
    <iframe src=="textChange.html" id="edit" frameborder="0"></iframe><script language="JavaScript" type="text/javascript">
    function tihuan(){
    document.getElementById("area").value=document.getElementById("edit").contentWindow.document.body.innerHTML;
    }
    </script>
    </body>
      

  13.   

    额~囧~
    还是不行啊。
    只是把html代码填到了textarea里去了。
      

  14.   

    有没有能改成js的，然后在html中调用？
      

  15.   

    可以参考下FCKeditor的调用
    <textarea id="content"></textarea>
    <iframe src="edit.html?instanceId=content"></iframe>在edit.html里
    获取url里的参数,把content隐藏，在edit.html的内容改变时，同时把值赋给content,这样1.html里就可以得到edit.html里的值了textarea也可以换成hidden,就不用隐藏了
      

  16.   

    用iframe试试呢
    iframe的src指向你要引入的文件
    然后在页面用iframeId.contentWindow.document.getXXX来取你想要的值
    不知道可不可以