-2

我有两个不同的页面，mouth.html 和nose.html。我想从mouth.html 中得到一个名字。所以当用户访问nose.html时，它会在nose.html中打印出来自mouth.html的地名。我怎样才能在 Javascript 中做到这一点？

这是mouth.html 中的代码

 <h1 class="man" style="clear:both;">{{ moot.name }}</h1>

在nose.html中，我试过了，但它不起作用

<script language="javascript">
   $("h1.man").load("mouth.html",function(data){
       var value=$(data).find("h1.man").attr("man")
   });

</script>

nose.html 中的完整代码

 <head> 
   <script language="javascript">
       $.get( 'mouth.html', function( data ) {
        var mootName = $(data).text();
      // Do something with mootName here
      alert(mootName);
   });
    </script>
  </head>
  <body>
  <form action="." method="POST">
{% csrf_token %}

    <div class="post-fed">
<p><label for="id_event_date">Event date:</label><input type="text" name="event_date" id="id_event_date" /><span class="helptext">E.g 2012-01-00.YYYY/MM/DD</span></p>
<p><label for="id_end_date">End date:</label><input type="text" name="end_date" id="id_end_date" /><span class="helptext">E.g. 2012-01-00.YYYY/MM/DD</span></p>
<p><label for="id_event_information">Event information:</label><textarea id="id_event_information" rows="10" cols="40" name="event_information"></textarea><span class="helptext"> E.g. eating etc</span></p>
<p><label for="id_full_name">Full name:</label><input id="id_full_name" type="text" name="full_name" maxlength="100" /></p>
<p><label for="id_e_mail">Email:</label></th><td><input id="id_e_mail" type="text" name="e_mail" maxlength="100" /></p>
<p><label for="id_phone_no">Phone no:</label></th><td><input id="id_phone_no" type="text" name="phone_no" maxlength="100" /></p>
<input type="submit"  class="put" value="Send"/> 

</form>  
</div>
</body>
4

3 回答 3

1

您可以像这样直接加载元素：

$('h1.man').load('mouth.html h1.man');

见http://api.jquery.com/load/

编辑：

正如 MichaelGeary 指出的那样，这也会复制元素，这是不可取的 ( <h1><h1></h1></h1>)。这会更好：

$.get('mouth.html', function(data) {
    var newText = $(data).find('h1.man').text();
    $('h1').text(newText);
});
于 2013-03-27T23:06:11.203 回答
1

.find只会匹配后代节点，您h1位于树的顶部。您可以使用.filter('h1.man')来获取匹配的顶级节点。

但是，请注意，对于刚刚插入的每个顶级元素（传入该节点this），回调将被调用一次，因此如果<h1>确实是您的顶级节点，您可以使用：

var value = $(this).attr(...);

这比$(data)使用 HTML 字符串调用更有效，因为这$(data)只会创建下载内容的另一个内存副本。

如果我正确理解文档，您还需要调用现有元素.load()的父h1.man元素，因为.load()会将加载的 HTML插入指定元素（替换现有内容）而不是替换最初指定的元素。

这也意味着这个父元素必须只包含h1.man元素，这表明您需要的是 HTML，因此：

<div id="h1_man_cont"><h1 class="man"> ... </h1></div>

和JS：

$('#h1_cont_man').load('mouth.html', function(data) {
    var value = $(this).attr(...);
});
于 2013-03-27T23:06:57.893 回答
0

正如您从这里的各种答案和评论中看到的那样，我们都对您正在尝试做的事情感到有些困惑。所以让我把它分成两个独立的问题，我们可以分别看每个问题。

第一个问题更清楚一点。您想获取其中的内容mouth.html并从中获取一些数据。mouth.html是从此 Django 模板生成的文件：

<h1 class="man" style="clear:both;">{{ moot.name }}</h1>

这就是整个模板；没有<html>或<body>没有其他任何东西。

因此，例如，如果您的 Python 变量moot.name是“Mike”，那么 的全部内容mouth.html将是：

<h1 class="man" style="clear:both;">Mike</h1>

现在我们要加载这个文件并从中获取“Mike”（或其他）。我们可以这样做：

$.get( 'mouth.html', function( data ) {
    var mootName = $(data).text();
    // Do something with mootName here
});

这是如何工作的：$(data)将整个<h1>标签作为 jQuery 对象提供给您，然后.text()从中获取内部文本内容。

现在对于下一部分，如何处理该名称？您必须弄清楚这一点，或者更详细地描述您想要做什么，因为那部分还不清楚。

于 2013-03-27T23:26:42.270 回答