【问题标题】:How to load the contents in the text file or the html codes in a html-file to a textarea by browsing it first?如何通过先浏览将文本文件中的内容或html文件中的html代码加载到textarea?
【发布时间】:2010-07-12 08:45:06
【问题描述】:

使用 javascript,如何从网页打开文本文件或 html 文件并将文本文件中的内容或 html 代码加载到文本区域。请不要告诉我这不可能使用 javsscript,这是可能的,但我不知道代码而且我的兄弟一周不回家。示例代码将不胜感激。 (我已经问过这个问题,但似乎每个人都专注于问题的另一部分。)

<html>
<body>
<form name="abc">
<textarea name="text">loaded text here</textarea>
<input type="button" onClick=""> open file
</form>
</body>
</html>

我在论坛上找到了这个,不记得名字了,这是一个工作代码,但只能加载文本文件....现在的问题是如何让它从 html 文件中获取 htmlcodes。

<html>
<head>

<meta http-equiv="Content-Language" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">


<script type="text/javascript">

var ForReading = 1, ForWriting = 2, ForAppending = 8;
var objFSO = new ActiveXObject("Scripting.FileSystemObject");

function loadFile(btn, obj, div, fld) {
objFile = objFSO.GetFile(obj.value);
objStream = objFile.OpenAsTextStream(ForReading);
fld.value = objStream.ReadAll();
objStream.Close();
objStream= null;
fileSpecs(div, btn);
objFile = null;
return true;
}

</script>
</head>

<body>
<form name="myForm" onsubmit="return false;">

<textarea rows="25" name="fileArea" cols="70"
onkeypress="return checkText(this, btnSave);"></textarea> </td>


<input type="file" name="fileName" size="50"
onchange="return checkFile(this, document.getElementById('fileSpec'), btnLoad, btnSave, fileArea);">

<input type="button" name="btnLoad" value="Load" 
onclick="return loadFile(this, fileName, document.getElementById('fileSpec'), fileArea);"> 

</form>
</body>
</html>

这是另一个编码器声称它正在工作但它对我不起作用,如果你有时间请执行此代码......如果它正在工作,请在此处提供完整的代码。 (由 Ancora 编码)

<html>
<head>
<script type="text/javascript">

function init(){

var extText = window.frames.messageTxt.document.body.lastChild.lastChild.data;
extText = extText.replace(/[\r\n]/g," ");
document.forms[0].nMessage.value = extText;
}

window.onload=init;

</script>
</head>
<body>
<iframe name='messageTxt' src='txtData.txt'  style='display:none'></iframe>
<form>
<textarea name='nMessage'></textarea>
<input type="button" value="click" onClick="init()">
</form>
</body>
</html>

我想没有可以做到这一点...我有一个 javascript 可以将 htmlcode 从外部 html 文件加载到 textarea 中。但是我丢失了那个文件,遗憾的是这里没有人有脚本能力来创建一个可以做同样事情的 js 函数(或活动 x)。

【问题讨论】:

  • 不可能……开玩笑的……:)
  • 你的脚本不正确,onclick="",里面的任何引号都必须转义或删除它周围的引号......第二:你在根文件夹下有一个名为“ajax_json_echo”的文件吗?它也应该是服务器端页面......告诉你什么,如果你没有跨浏览器的要求,这个链接只适用于 IE:msdn.microsoft.com/en-us/library/ms531417(v=VS.85).aspx
  • thanx 我只需要它在 IE 中工作(不关心其他浏览器),而且我没有 ajax _json_echo 文件.....所以我现在要检查网站。
  • 也在寻找替代答案....任何建议都将受到欢迎
  • $.get 和您使用的其他代码看起来像 jQuery;您需要加载 jQuery 脚本:&lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"&gt;&lt;/script&gt;

标签: javascript html


【解决方案1】:

这绝对是可能的,使用 AJAX。您必须记住,同源限制意味着它仅适用于您自己的域。一种方法是使用jQuery.get

编辑:更完整的演示(另见jsFiddle demo):

<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.js"></script>
<script type="text/javascript">

    function download_to_textbox(url, el)
    {
      $.get(url, null, function(data)
                       {
                         el.val(data);
                       }, "text");
    }

    $(function()
    {
      $('#open').click(function()
      {
        download_to_textbox("/ajax_json_echo/?foo=bar", $("textarea[name='text']"));
      });
    });
</script>
</head>
<body>
    <form name="abc">
        <textarea name="text" rows="20" cols="70">loaded text here</textarea>
        <input id="open" value="open" type="button">
    </form>
</body>
</html>

【讨论】:

  • 上面的代码是一个函数,我如何使用 onclick 命令调用它
  • 您还可以将 HTML 文档加载到隐藏的 iframe 中,然后从那里获取 HTML。见webmasterworld.com/javascript/3083765.htm
  • 我的代码是否正确...如果我做错了什么请纠正我
  • 在那个页面中我得到了这个结果 {"post_response": {}, "get_response": {"foo": "bar"}}
  • @subbanki,它不应该打开一个对话框。相同的域/来源意味着大致相同的网络服务器。见same origin policy。这是演示的预期输出。它正在被服务器回显。
【解决方案2】:

上面的答案工作正常,但你必须了解他们正在做什么来定制。 这是最简单的解决方案(自定义上述解决方案),它是 在 IE8 上测试并且工作正常(请记住,您必须在 iframe 中查看 HTML 渲染才能知道您的 src 属性正确):

<html> 
<head> 
<script type="text/javascript">   
function init(){ 
    var extText = window.frames[0].document.getElementsByTagName("HTML")[0].outerHTML;
    document.getElementById("nMessage").innerText = extText;
} 

</script> 
</head> 
<body> 
    <iframe name="messageTxt" src="[place the path to your html file here]" ></iframe> 
    <form> 
        <textarea name="nMessage" id="nMessage" cols="100" rows="20"></textarea> 
        <input type="button" value="click" onClick="init()" /> 
    </form> 
</body> 
</html>

【讨论】:

  • 我对 javascript 非常陌生,无法轻松理解那些符号和字符,无论如何感谢您付出的努力。我已经在另一篇文章中得到了我想要的东西...stackoverflow.com/questions/3235883/…你能解决我在那篇文章中遇到的最后一个问题吗?再次感谢
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2014-12-19
  • 1970-01-01
  • 2012-07-03
  • 1970-01-01
  • 2012-04-18
  • 1970-01-01
  • 2017-04-23
相关资源
最近更新 更多