Может ли этот код быть улучшено? jQuery с SharePoint


Я написал некоторый код JavaScript с jQuery, чтобы создать складные веб-частей в SharePoint 2010.

Может кто-нибудь предложить некоторые улучшения? Как я думаю, что методы я использую для селекторов не идеальны. Решение прекрасно работает как есть, я просто хочу убедиться, что я был максимально эффективным.

Ниже представлен фрагмент кода HTML, который я делаю обработку.

Обновление: просто к сведению, я начиная с С4-wpTopTable , потому что это лучший способ для меня, чтобы я имею дело с SharePoint WebPart, который.

<table width="100%" cellpadding="0" cellspacing="0" border="0">
<tr>
    <td id="MSOZoneCell_WebPartWPQ4" valign="top" class="s4-wpcell" onkeyup="WpKeyUp(event)" onmouseup="WpClick(event)">
        <table class="s4-wpTopTable" border="0" cellpadding="0" cellspacing="0" width="100%">
            <tr>
                <td>
                    <table border="0" cellpadding="0" cellspacing="0" width="100%">
                        <tr class="ms-WPHeader">
                            <td align="left" class="ms-wpTdSpace">&#160;</td>
                            <td title="Links - Use the Links list for links to Web pages that your team members will find interesting or useful." id="WebPartTitleWPQ4" class="ms-WPHeaderTd">
                                <h3 style="text-align:justify;" class="ms-standardheader ms-WPTitle">
                                    <a accesskey="W" href="/sites/test/Lists/Links"><nobr><span>Links</span><span id="WebPartCaptionWPQ4"></span></nobr></a>
                                </h3>
                            </td>
                            <td align="right" class="ms-WPHeaderTdMenu" onclick="OpenWebPartMenu(&#39;MSOMenu_WebPartMenu&#39;, this, &#39;WebPartWPQ4&#39;,&#39;False&#39;); TrapMenuClick(event); return false;"><span style="display:none;"></span><div class="ms-WPMenuDiv" onmouseout="this.className='ms-WPMenuDiv'" onmouseover="this.className='ms-WPMenuDivHover'"><a onclick="OpenWebPartMenuFromLink(&#39;MSOMenu_WebPartMenu&#39;, this, &#39;WebPartWPQ4&#39;,&#39;False&#39;); return false;" id="WebPartWPQ4_MenuLink" onkeydown="WebPartMenuKeyboardClick(document.getElementById('WebPartWPQ4_MenuLink'), 13, 40, event)" href="#" title="Links Web Part Menu" class="ms-wpselectlink" onblur="UpdateWebPartMenuFocus(this, 'ms-wpselectlink', 'ms-WPEditText');" onfocus="UpdateWebPartMenuFocus(this, 'ms-wpselectlinkfocus', 'ms-WPEditTextVisible');" menuid="MSOMenu_WebPartMenu"><img class="ms-WPHeaderMenuImg" src="/_layouts/images/wpmenuarrow.png" alt="Links Web Part Menu" style="border-width:0px;" /></a></div></td><td class="ms-WPHeaderTdSelection"><span class="ms-WPHeaderTdSelSpan"><input type="checkbox" id="SelectionCbxWebPartWPQ4" class="ms-WPHeaderCbxHidden" title="Select or deselect Links Web Part" onblur="this.className='ms-WPHeaderCbxHidden'" onfocus="this.className='ms-WPHeaderCbxVisible'" onkeyup="WpCbxKeyHandler(event);" onmouseup="WpCbxSelect(event); return false;" onclick="TrapMenuClick(event); return false;" /></span></td><td align="left" class="ms-wpTdSpace">&#160;</td>
                        </tr>
                    </table>
                </td>
            </tr>
            <tr>
                <td class="" valign="top">
                    //CONTENT WILL BE IN HERE
                </td>
            </tr>
        </table>
    </td>
</tr>
</table>

И это jQuery, который я использую:

<script type="text/javascript" src="http://ajax.Microsoft.com/ajax/jQuery/jquery-1.7.1.min.js"></script>
<script type="text/javascript">
jQuery(function($) {
    $('.s4-wpTopTable').find('tr:first h3').append('<a class=\'min\' style=\'float:right\'><img src=\'/_layouts/images/collapse.gif\'/></a>');
        var Collapse = "/_layouts/images/collapse.gif";
        var Expand = "/_layouts/images/expand.gif";
    $('.min').click(function(){     
        var img = $(this).children();
        $(this).closest('.s4-wpTopTable').find('tr:first').next().toggle().is(":visible") ? img.attr('src',Collapse) : img.attr('src',Expand );
    });
});
</script>


908
4
задан 16 декабря 2011 в 02:12 Источник Поделиться
Комментарии
1 ответ

$('.s4-wpTopTable').find('tr:first h3')...

такой же, как и

$('.s4-wpTopTable tr:first h3')...

Только один удар по jQueury Богу, вместо двух.
также вы связываете обработчик щелчка после сдачи его в дом. Вы можете сделать это другим способом:

// ...
.append(
$('<a class=\'min\' style=\'float:right\'><img src=\'/_layouts/images/collapse.gif\'/></a>')
.click(function(){
var img = $(this).children();
$(this)
.closest('.s4-wpTopTable')
.find('tr:first')
.next()
.toggle().is(":visible") ? img.attr('src',Collapse) : img.attr('src', Expand);
})
);

3
ответ дан 27 ноября 2013 в 02:11 Источник Поделиться