style.display لا يعمل في Firefox وOpera وSafari - IE7 OK

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

  •  08-06-2019
  •  | 
  •  

سؤال

لدي موقف مطلق div أريد إظهاره عندما ينقر المستخدم على الرابط.ال onclick من الرابط يستدعي وظيفة js التي تقوم بتعيين عرض div للحظر (جرب أيضًا:""، inline, table-cell, inline-table, ، إلخ).يعمل هذا بشكل رائع في IE7، وليس على الإطلاق في كل المتصفحات الأخرى التي جربتها (FF2، FF3، Opera 9.5، Safari).

لقد حاولت إضافة تنبيهات قبل وبعد المكالمة، وهي تظهر أن العرض قد تغير من none ل block لكن ال div لا يعرض.

يمكنني الحصول على div لعرضه في FF3 إذا قمت بتغيير قيمة العرض باستخدام مفتش HTML الخاص بـ Firebug (ولكن ليس عن طريق تشغيل javascript من خلال وحدة تحكم Firebug) - لذلك أعلم أنها لا تظهر فقط خارج الشاشة، وما إلى ذلك.

لقد جربت كل ما يمكنني التفكير فيه، بما في ذلك:

  • استخدام نوع مستند مختلف (XHTML 1، HTML 4، إلخ)
  • استخدام الرؤية مرئية/مخفية بدلاً من كتلة العرض/لا شيء
  • استخدام جافا سكريبت المضمن بدلاً من استدعاء الوظيفة
  • اختبار من آلات مختلفة

أي أفكار حول ما يمكن أن يسبب هذا؟

هل كانت مفيدة؟

المحلول 2

نظرًا لأن تعيين الخصائص باستخدام جافا سكريبت لم ينجح أبدًا، ولكن الإعداد باستخدام فحص Firebug نجح، فقد بدأت أشك في أن محدد معرف جافا سكريبت معطل - ربما كان هناك عناصر متعددة في DOM بنفس المعرف؟لم يُظهر المصدر وجود ذلك، ولكن من خلال التكرار عبر جميع أقسام div باستخدام جافا سكريبت وجدت أن هذا هو الحال.هذه هي الوظيفة التي انتهيت من استخدامها لإظهار النافذة المنبثقة:

function openPopup(popupID)
{
  var divs = getObjectsByTagAndClass('div','popupDiv');
  if (divs != undefined && divs != null)
  {
    for (var i = 0; i < divs.length; i++)
    {
      if (divs[i].id == popupID)
        divs[i].style.display = 'block';        
    }
  }
}

(وظيفة الأداة المساعدة getObjectsByTagAndClass غير مدرجة)

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

لذا، عند تصحيح مشكلات مثل هذه، تذكر أن تتحقق من وجود معرفات مكررة في DOM، والتي يمكن أن تؤدي إلى تعطيل getElementById.

لكل من أجاب، شكرا لمساعدتكم!

نصائح أخرى

هل يمكنك تقديم بعض العلامات التي تنتج الخطأ؟يجب أن يكون لموقفك علاقة بالرمز الخاص بك حيث يمكنني تشغيل هذا على IE وFF3 وOpera 9.5:

function show() {
  var d = document.getElementById('testdiv');
  d.style.display = 'block';
}
#testdiv {
  position: absolute;
  height: 20px;
  width: 20px; 
  display: none;
  background-color: red;
}
<div id="testdiv"></div>
<a href="javascript:show();">Click me</a>

وجدت الجواب :أحتاج إلى استخدام ما يلي لجعله يعمل على كلا المتصفحين:

document.getElementById('editRow').style.display = '';

في الحقيقة كنت أعاني من نفس المشكلة التي تصفها هنا.ما أصلح مشكلتي بالفعل هو تغيير خصائص المستند.

مواصفات DOCTYPE/html القديمة

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

تم استبداله ب

<html>

تحقق من وحدة التحكم في الأخطاء (قائمة الأدوات > وحدة التحكم في الأخطاء في Firefox 3) للتأكد من عدم حدوث خطأ آخر لا تراه، مما يؤدي إلى إيقاف تشغيل البرنامج النصي الخاص بك.

حاول ضبط ارتفاع وعرض div، وتأكد من وجوده في الأعلى عن طريق تعيين مؤشر z الخاص به أعلى من أي شيء آخر.إذا كان div ذو موضع مطلق داخل عنصر تم وضعه نسبيًا، فإن موقعه العلوي واليسار يستند إلى الجزء العلوي واليسار من العنصر ذي الموضع نسبيًا.حاول وضع div الخاص بك أسفل عنصر الجسم مباشرة.

يجب أن تكتب أ window.onload طريقة:

window.onload = document.getElementById('testdiv').style.display='inline';

أو يمكنك أيضًا إنشاء متغير:

var d = document.getElementById('testdiv');
window.onload = d.style.display = 'inline';

يوجد خطأ عرض مزعج على Firefox 3.5 ولكن ليس على IE7 أو Firefox 2.0.9

لدي 3 موضع DIV مطلق - الأول بنص عادي؛والثاني مع قائمة CSS (نوع السمكة الماصة مع UL وLI) والثالث كما سبق.لن يتم عرض الثالث على الإطلاق على الرغم من فحص الترميز وتبين أنه مثالي باستخدام مدقق HTML الخاص بـ W3C.

كإجراء مؤقت، قمت بدمج محتويات DIV الثاني والثالث.

يجب أن تكون الأمور سيئة في Mozilla عندما يعرض IE7 وFF2 موافق ولكن ليس FF 3.5

سأعطيك تلميحًا كبيرًا:

<div style="..." class="..."> ... </div>

إذا كان لديك شيء مميز، فسيعمل document.style!إذا كان لديك شيء ما في الفصل، فلن يظهر في document.style وclass = "..." سوف يتجاوزه!

فكر في هذا وسيؤدي هذا إلى حل العديد من المشكلات.هذا الفهم البسيط فقط سوف يخلصك من فيروس العقل هذا.اتمنى لك يوم جيد.في صحتك، رون لينتجيس، LC CLS.

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top