تركز نص شريط العنوان في JQGrid مع الحفاظ على زر فتح/إغلاق؟

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

  •  28-09-2019
  •  | 
  •  

سؤال

أرغب في مركز نص شريط العنوان على jqgrid دون العبث بالصورة المفتوحة/الإغلاق. لكنني تمكنت فقط من الحصول عليها على حد سواء النص وفتح/إغلاق صورة زر. سأكون ممتنًا لبعض النصائح حول كيفية الحصول على النص تركزت مع الحفاظ على صورة المرساة في وضع.

إليكم العلامات التي يظهرها مفتش Chrome:

<div class="ui-jqgrid-titlebar ui-widget-header ui-corner-top ui-helper-clearfix">
   <a role="link" href="javascript:void(0)"
      class="ui-jqgrid-titlebar-close HeaderButton" style="right: 0px;">       
       <span class="ui-icon ui-icon-circle-triangle-n"></span>
   </a>
   <span class="ui-jqgrid-title">Titles</span>
 </div>

شكرًا

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

المحلول

حاول مع المتابعة

jQuery(".ui-jqgrid-title").replaceWith('<div style="text-align: center;"><span>' +
        jQuery(".ui-jqgrid-title").text() + '</span></div>');

أو مع

jQuery(".ui-jqgrid-title").replaceWith(
    '<div style="text-align: center; padding: .3em .2em .2em .3em;"><span>' +
    jQuery(".ui-jqgrid-title").text() + '</span></div>');

محدث: يجب أن أصلح حللي قليلاً إلى 1) السماح setCaption الطريقة تواصل العمل ؛ 2) العمل بشكل صحيح إذا كان لدى المرء أكثر مثل jqgrid واحد على الصفحة:

var captionDiv = jQuery("#list")[0].grid.cDiv;
var titleSpan = jQuery(".ui-jqgrid-title",captionDiv);
titleSpan.css ("float", "none");
titleSpan.parent().css ("text-align", "center");

في الكود "قائمة" هو معرف <table> عنصر الشبكة. عنصر DOM من JQGRID (jQuery("#list")[0]) تم توسيعها مع grid الخاصية التي لها عناصر DOM لثلاثة مكونات JQGRID مهمة (cDiv - شرح، hDiv - رؤوس الجدول و bDiv - جدول الجدول). نحن نستخدم .grid.cDiv للحصول على عنصر DOM من التسمية التوضيحية (رأس الشبكة) بأقوى طريقة. ثم نعطي span عنصر التسمية التوضيحية والجمل "float: left" نمط "ui-jqgrid-title" الفصل الذي ربما جعلك أكثر مشكلة. في النهاية ، وضعنا نمطًا إضافيًا للوالد div عنصر ل "text-align: center" لإنهاء كل العمل.

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