0

请多多包涵，因为我是学生。我的导师让我们观看了 5 个 YouTube 视频，现在希望我们使用 JQuery 而不是标准 JavaScript 进行编程。我要做的就是将一个元素与另一个文件中的元素交换。

这是我的 HTML 代码：

<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Testing JQuery</title>
    <script src="jquery-1.7.2.min.js"></script>
  </head>
  <body>
    <h1 id="header">Testing JQuery</h1>
    <p id ="dummy">Lorem Ipsum </p>
    <script src="changes.js"></script>
    <form name="input" action="changes.js">
    <input type="button" value="Change the Header">
    </form>
  </body>
</html>

这是我的 JavaScript/JQuery 代码：

$(document).ready(function() {
  $('input').click(function() {
    var url = $(this).attr('form');
    $('#header').load( greeting.html + '#ajax h1');
    return false;
  });
});

第三个文件名为 greeting.html，它包含以下内容：

<h1 id="ajax">Hello from jQuery with AJAX</h1>
4

2 回答 2

1

要替换元素，load()它将无法工作，因为它将新 H1 加载到旧 H1 中，它不会替换它，所以你必须自己使用$.get和做：

$(document).ready(function() {
    $('input').on('click', function() {
        $.get({
             url : 'greeting.html'
        }).done(function(data) {
             var h1 = $('<div />').append(data).find('h1#ajax');
             $('#header').replaceWith(h1);
        });
       return false;
    });
});
于 2013-09-19T21:54:44.537 回答
1 
$('#header').load( 'greeting.html #ajax' );

这就是你所需要的。摆脱所有其他的东西。您不需要声明url，也不需要返回 false。

于 2013-09-19T21:55:11.213 回答