هل هناك طريقة صنع العادي روابط تحميل تلقائيا من خلال اياكس, بدلا من عادة ؟

https://stackoverflow.com/questions/1449074

11-09-2019
|

سؤال

أنا لم أوضح هذا جيدا.

ولكن ما أعنيه هو إذا كنت اياكس النصي الذي يقوم بتحميل محتوى صفحة في عنصر DIV, من خلال وظيفة 'loadpage('whatever.php'); بدلا من البحث يدويا تفعل هذا كل الروابط, هل هناك طريقة من وجود البرنامج النصي تلقائيا يجعل جميع الروابط العادية الحمل من خلال ذلك اياكس وظيفة ؟

مثل Facebook, بتحميل التشكيل الجانبي الخاص بك من خلال اياكس, ولكن إذا نظرتم إلى التعليمات البرمجية الخاصة بهم ، لديهم فقط منتظم رابط الملف الشخصي.

هتاف!

المحلول

بالتأكيد, يمكنك أن تفعل ذلك مع مسج.

هذا البرنامج النصي يذهب من خلال الوثيقة ، يجد كل مرساة عنصر يربط معالج الحدث إلى الحدث انقر فوق بعضها.عندما مرساة عنصر النقر على معالج الحدث يجد السمة href والأحمال تلك الصفحة في #targetDiv (يمكنك استدعاء هذه div ما تريد, بالطبع).

<script type="text/javascript"
        src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js">
</script>
<script type="text/javascript">
$(document).ready(function() {
  $("a").click(function() {
    $("#targetDiv").load(($(this).attr("href") + " body");
    return false;
  });
});
</script>

...

<!-- In your document body, this is the div you'd load the pages into. -->
<div id="targetDiv"></div>

نصائح أخرى

يمكنك استخدام JQuery لهذا (إذا فهمت سؤالك الصحيح).

أولا، يمكنك إجراء LoadPage الوظيفة () كما يلي:

function loadpage(divId, url) {
    $('#' + divId).load(url);

    return false;
}

تحميل () غير مدعوم من جميع المتصفحات رغم ذلك. إذا كنت ترغب في القيام بذلك دون. تحميل () ثم يمكنك التحقق من .get (). لمزيد من المعلومات حول. تحميل ()، إلقاء نظرة على http://docs.jquery.com/ajax/load.

أفترض أنه سيذهب شيئا مثل هذا:

$(document).ready(function(){
    $("a").click(function(){
        $("body").load($(this).attr("href") + " body");
        return false;
    });
});

هذا من شأنه أن يجعل كل شيء <a> العلامات على صفحة استدعاء وظيفة تقوم بتنزيل مستند HTML من href سمة العلامة، قم بتعليم علامة الجسم، واستبدل محتويات علامة جسم الصفحة الحالية مع محتويات علامة الجسم الجديدة. بهذه الطريقة، من الأسهل العمل هذا مع عدم وجود جافا سكريبت، وكذلك دمجه في موقع موجود.

لاستخدامها، تضع هذا في <script> علامة في رأس صفحتك الرئيسية، أو في ملف JS خارجي.

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

بسيطة ولطيفة. تحقق من هذا:باجاكس

الاستعمال:

<script src="bjax.min.js" type="text/javascript"></script>
<link href="bjax.min.css" rel="stylesheet" type="text/css" />

أخيرا، قم بتضمين هذا في رأس HTML الخاص بك:

$('a').bjax();

لمزيد من الإعدادات، الخروج تجريبي هنا:بيجاكس التجريبي

مرخصة بموجب: CC-BY-SA مع الإسناد

لا تنتمي إلى StackOverflow