الرجاء مساعدتي في إصلاح وظيفة jQuery هذه ومعرفة احتياطي في حالة تعطيل JavaScript

Question

من المفترض أن يحصل هذا الرمز على المعرف من علامة مرساة تم النقر عليه في منتصف UL مع "روابط" المعرف ثم استخدم هذا المعرف لأغراض أخرى عبر الصفحة ، ومع ذلك فقد أظهرت لي التنبيهات أنني أستمر في الحصول على "غير محدد" كما لو أن العنصر ليس لديه معرف. أتحقق من كود المصدر الخاص بي ولديهم بالفعل معرفات ، لذلك لست متأكدًا من المشكلة.

$(function() {      
    $('ul#links > li > a').click(function() {

        var planet = $(this).id;
        alert(planet);
        $('#planet').removeClass();
        $('#planet').addClass('planet');

        var bg = 'black url(../img/' + planet + '.jpg) fixed no-repeat center';
        alert(bg);
        $('body').css('background', bg);
    });             
});

كما يتم استخدام وظيفة jQuery هذه كوسيلة JavaScript للتعامل مع هذا النوع من المواقف. لقد قمت بالفعل بتطبيق حل PHP الذي ينطوي على إعادة توجيهه إلى برنامج نصي سريع يقوم بتعيين ملف تعريف ارتباط وإرجاع المستخدم إلى الصفحة السابقة ، ثم باستخدام ملف تعريف الارتباط لتحميل CSS جديد. هل هناك طريقة يمكنني استخدام هذه الطريقة كنسخة احتياطية لطريقة JS في حالة تعطيل JS؟

الصفحة - http://schnell.dreamhosters.com/folio/

Answer 1

كنت قريب جدا:

$(function() {      
  $('ul#links > li > a').click(function() {
    var planet = this.id;
    $('#planet').removeClass().addClass("plane");
    var bg = 'black url(../img/' + planet + '.jpg) fixed no-repeat center';
    $('body').css('background', bg);
    return false;
  });             
});

أولاً، this.id سوف تحصل على المعرف. بديل jQuery هو $(this).attr("id").

ثانياً ، يمكنك سلسلة addClass() و removeClass() لإنقاذ البحث عن العنصر مرتين. هذا ليس ضروريًا لمشكلتك ولكنه ممارسة جيدة.

ثالثًا ، ما لم تكن تريد رابطك إلى Traverse في مكان ما ، تحتاج إلى منع الإجراء الافتراضي (عن طريق الاتصال evt.preventDefault() على كائن الحدث الذي تم نقله إلى رد الاتصال) أو ببساطة ينتهي بـ return false; (وهو ما يفعله أيضا evt.stopPropagation()).

أخيرًا ، ما تفعله مناسب تمامًا للعمل مع JavaScript Divables لأنه يمكنك الانتقال إلى صفحة تفعل الشيء نفسه. لن أزعج نفسي بإعداد ملف تعريف الارتباط وإعادة التوجيه. إذا كان اسم البرنامج النصي URI /view/planet.php افعل هذا:

<a id="saturn" href="/view/planet.php?planet=saturn">Saturn</a>

داخل نفس البرنامج النصي الذي يمكنك القيام به (أفترض PHP هنا ؛ لم أر أي ذكر لما تستخدمه):

$planets = array(...);
$planet = $_GET['planet'];
if (in_array($planet, $planets)) {
  echo <<<END
<style type="text/css">
body { background: black url(.../img/$planet.jpg) fixed no-repeat center; }
</style>
END;
}

أثناء تقديم الصفحة.

Answer 2

$(this).id هو المكان الذي تكون فيه القضية ... استخدام $(this).attr('id')

Answer 3

تقوم بإنشاء كائن jQuery من العنصر ومحاولة الحصول على المعرف من ذلك. من شأنه أن تستخدم طريقة ATTR ، ولكن يجب عليك فقط الحصول على المعرف من العنصر نفسه:

var planet = this.id;

أما بالنسبة لطريقة النسخ الاحتياطي ، فإن هذا يبدو معقولًا. ومع ذلك ، بدلاً من الارتباط بصفحة مختلفة ، أود أن أرتبط بنفس الصفحة باستخدام QueryString يحدد ما يجب عرضه.