مسج تحميل متعددة في DIV

StackOverflow https://stackoverflow.com/questions/866284

  •  21-08-2019
  •  | 
  •  

سؤال

وهنا هو رمز بلادي 

$('#right').load('textes.html #nicolas');
$('#right').load('textes.html #antoine');

والمشكلة هي أن محتوى شعبة أنطوان الكتابة في حق شعبة تحميل المحتوى من قبل نيكولا شعبة

وشعبة #right: نيكولا الحمل شعبة من textes.html ملف = طيب شعبة #right: تحميل شعبة أنطوان من textes.html ملف = محتوى الكتابة فوق = لا

وأنا أحب لإلحاق انطوان نقولا أود أن أضيف نيكولا ثم إضافة أنتون حتى #right ستكون نيكولا + أنطوان

ولدي محاولة للحصول على المحتوى في فار ... كلا

وأي فكرة؟

وعلى رأس ذلك ... أنا لن أود أن أضيف <hr> حكم بين كل حمولة

وربما شيء من هذا القبيل يمكن القيام به ... انها لا تعمل! 

$('#right').load('textes.shtml #nicolas').append('<hr>').load('textes.shtml #antoine'); return false;
هل كانت مفيدة؟

المحلول

وربما أنا في عداد المفقودين شيء ولكن يبدو أنكم جميعا في عداد المفقودين حقيقة أن هذا هو دعوة اياكس وكنت استدعاء دالات إجرائيا وليس وظيفة الاستدعاء بناء على استجابة اياكس ناجحة.

وعلاوة على ذلك، إذا كنت تفعل أي شيء أكثر تعقيدا من تحميل بعض (X) HTML إلى عنصر، ربما يجب عليك استخدام واحدة من أقوى وسائل اياكس مسج (أي الحصول على () أو آخر () أو اياكس ()) .

وعلى افتراض انك سوف تحصل على (X) HTML في الاستجابة: 

// Only ONE ajax call and very simply parsing... 
$.get('textes.html', {}, function(data) {
    var $response = $('<div />').html(data);
    var $nicolas = $response.find('#nicolas')
    var $antoine = $response.find('#antoine');
    $('#right').append($nicolas).append($antoine);
},'html');

وانها حقا بهذه البساطة.

نصائح أخرى

لماذا يتم تحميل لهم على حد سواء في مكالمة واحدة: 

$('#right').load('textes.html #nicolas,#antoine');

تعديل
مستوحاة من الطريقة العدل فكرت في FOLLWOING: 

var $page = $('<div />').load('textes.html #nicolas,#antoine');
var $nicolas = $page.find('#nicolas');
var $antoine = $page.find('#antoine');
$('#right')
 .html($nicolas)
 .append('<hr/>')
 .append($antoine);

وهذا سيجعل الوحيد (أو اثنين، وهذا يتوقف على ما يشعر فايرفوكس مثل) يدعو إلى الملقم. مما يوفر عرض النطاق الترددي. لكنه يتيح لك أيضا المزيد من الحرية في كيفية إدراج العناصر وفي أي ترتيب.

وهنا رمز المصدر الكامل عن حل.

ولقد استضافت عينة العمل على JSBin.com: http://jsbin.com/ulodu (قابل للتحرير عن طريق http://jsbin.com/ulodu/edit ) 

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"></script>
<title>Sandbox</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<script>
$(function(){
  $.get(
    'http://jsbin.com/oyuho',
    function(response){
      /* 
        Wrap the response in a <div /> so that we can use
        find() instead of filter(). Also remove <script> tags.
        This is essentially what $.load() does.
      */  
      var responseWrapper = $('<div />').append(response.replace(/<script(.|\s)*?\/script>/g, ""))
      $('#content')
        .append(responseWrapper.find('#nicolas'))
        .append('<hr />')
        .append(responseWrapper.find('#antoine'));
    }
  );
});
</script>
</head>
<body>
  <div id="content"></div>
</body>
</html>

var nicolas = $('<div />').load('textes.html #nicolas');
var antoine = $('<div />').load('textes.html #antoine');
$('#right')
    .append(nicolas.children())
    .append('<hr />')
    .append(antoine.children())
;

وأو طريقة بيم جاجر و.

appendTo وظيفة.

وحصلت عليه العمل مع الإجابة حقا بسيطة من KyleFarris

وأنا حتى تبسيطه أكثر من ذلك بقليل، وأنها تعمل بشكل جيد

وThnaks الجميع، وهنا هو رمز النهائي: 

<script>
$.get('textes.shtml', {}, function(data) {
    var $response = $('<div />').html(data);
    $('#right')
    .append($response.find('#nicolas'))
    .append('<hr />')
    .append($response.find('#antoine'));
},'html');
</script>
مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top