1

jquery と ajax を使用して Web ページの一部を更新していますが、機能しません。ページは次のとおりです。

   <!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Insertion, copie et suppression de données</title>
  </head>
  <body>
  <!----------------------------------------------------------------- -------------------->
<style type="text/css">
  div { width: 400px; height: 300px; float: left; margin: 5px; }
  #premier { background-color: #F6E497; }
  #troisieme { background-color: #CAF1EC; }
  #quatrieme { background-color: #F1DBCA; }
</style>
<button id="majPremier">Mise à jour première zone</button>
<button id="majDeuxieme">Mise à jour deuxième zone</button><br /><br />
<div id="premier">
  Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do 
eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim 
ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut 
aliquip ex ea commodo consequat.
</div>
<div id="deuxieme">
  <img src="image.png">
</div>
<script src="jquery.js"></script>
<script>
  $(function() {
    $('#majPremier').click(function() {
      $('#premier').load('maj1.html', function() {
        alert('La première zone a été mise à jour');
      });
    });
    $('#majDeuxieme').click(function() {
          $('#deuxieme').load('maj2.html', function() {
        alert('La deuxième zone a été mise à jour');
      });
    });
  });
</script>
    <!-- - ---------------------------------------------------------------------------------------------------------->
   </body>
</html>

ajax でページを更新するために使用するファイル maj1.html は次のとおりです。

<html>
  <head>
    <meta charset="UTF-8">
  </head>

  <body>
    Ut enim ad minima veniam, quis nostrum exercitationem ullam 
corporis suscipit laboriosam, nisi ut aliquid ex ea commodi 
consequatur? Quis autem vel eum iure reprehenderit qui in ea 
voluptate velit esse quam nihil molestiae consequatur, vel illum qui 
dolorem eum fugiat quo voluptas nulla pariatur?
  </body>
</html>

私は 1 つの frensh チュートリアルからそれらを取得しました。Google クロムの inspect 要素を使用すると、次のエラーが表示されます: xmlhttprequest cannot load file ... origin null is not allowed by access control allow origin

4

1 に答える 1

2

.load()ローカルでファイルにアクセスしている場合は機能しません。ファイルを Web サーバーに配置する必要があります。

于 2013-03-13T23:00:17.457 に答える