Question

我希望在渲染后在 fullcalendar agendaWeek 中更改style="width: 1px;"的所有出现次数style="width: 41px;"，因为我使用了eventAfterRender 我的代码是

    eventAfterRender: function(event, $el, view) {
                        if( 'agendaWeek' === view.name ) {
                            var r = new RegExp(style="width: 1px;", "g");
                            var txtWith = 'style="width: 41px;"';

                            $el.find(".fc-body").val().replace(r, 
                            txtWith).
                            replace(/\</g, "&lt;").replace(/\>/g, 
                           "&gt;").replace(/\&/g, "&amp;");
        }

Answer 1

我没有尝试更改内联样式属性，而是指定一个覆盖内联样式的CSS类。

$el.addClass('wideCell');

班级.wideCell将是这样的：

.wideCell {
    width: 41px !important;
}

如果你绝对想要采用替代策略，我建议使用以下正则表达式：

 function replaceInlineWidth(element) {
    // When the element has no style attribute, skip it.
    if (!element.hasAttribute('style')) {
      return;
    }
    
    // Get the style attribute from the element
    var inlineStyle = element.getAttribute('style'), 
        regex = /width\s?:\s?\d+px(?:;|$)/g;
        
    // Replace the inline width declaration with 41px
    inlineStyle = inlineStyle.replace(regex, 'width: 41px;');
    // Set the modified style attribute back on the element.
    element.setAttribute('style', inlineStyle);
 }
 
 // Create a test element.
 var 
    element = document.createElement('div');
    
 // Give the test element some inline style.
 element.setAttribute('style', 'background-color: #000; width: 1px; margin: 1em;');
 // Run the replacement method.
 replaceInlineWidth(element);
 // Log the inline style, the width should be 41px.
 console.log(element.getAttribute('style'));

它会匹配width:1px，width :1px和width: 1px等内容。它也匹配width: 30px。它会更有弹性。如果您真的只想替换width: 1px，请将正则表达式更改为width\s?:\s?1px(?:;|$)。

Answer 2

更改 fc-axis 样式，

第一个解决方案，

@Thijs idea

添加到您的css文件

.wideCell { 宽度：41px！重要; }
转到 fullcalendar.js 并将wideCell添加到包含fc-axis，EXP
的任何类
'<td class="fc-axis fc-time '

成为

'<td class="fc-axis fc-time wideCell '

fullcalendar weekview not showing correctly

但它应该像fullcalendar weekview showing correctly

第二种解决方案

打开 fullcalendar.js 并更改

var maxInnerWidth = 0;至var maxInnerWidth = 40;\\40 or what ever feet your need，

是否有一种简单的方法可以在fullcalendar中用另一种样式替换样式

2 个答案:

第一个解决方案，

第二种解决方案