我正在尝试集中化我的js脚本,以便可以在多个页面上重复使用

时间:2019-09-06 17:48:43

标签: javascript sharepoint-2013

示例1:我在脚本编辑器中拥有一个js脚本,用于包装提升的链接。我要替换为对js脚本的引用,该脚本将放置在站点资产中,并传递一个等于每行链接数的参数。

因此,我将代码移到了站点资产中,并使用以下内容对其进行了引用,但它似乎不起作用。我正在使用脚本编辑器。尚未传递任何参数。

<script type="text/javascript" src="../Site%20Assets/js-enterprise/WrapPromotedLinks.js"></script>

我在网站资产中的代码是:

<script type="text/javascript" src="https://code.jquery.com/jquery-1.10.2.min.js Jump "></script>
<script type="text/javascript">
$(document).ready(function () {

// Update this value to the number of links you want to show per row
var numberOfLinksPerRow = 3;
alert(numberOfLinksPerRow);   

// local variables
var pre = "<tr><td><div class='ms-promlink-body' id='promlink_row_";
var post = "'></div></td></tr>";
var numberOfLinksInCurrentRow = numberOfLinksPerRow;
var currentRow = 1
// find the number of promoted links we're displaying
var numberOfPromotedLinks = $('.ms-promlink-body > .ms-tileview-tile-root').length;
  // if we have more links then we want in a row, let's continue
  if (numberOfPromotedLinks > numberOfLinksPerRow) {
    // we don't need the header anymore, no cycling through links
    $('.ms-promlink-root > .ms-promlink-header').empty();
    // let's iterate through all the links after the maximum displayed link
    for (i = numberOfLinksPerRow + 1; i <= numberOfPromotedLinks; i++) {
      // if we're reached the maximum number of links to show per row, add a new row
      // this happens the first time, with the values set initially
      if (numberOfLinksInCurrentRow == numberOfLinksPerRow) {
        // i just want the 2nd row to
        currentRow++;
        // create a new row of links
        $('.ms-promlink-root > table > tbody:last').append(pre + currentRow + post);
        // reset the number of links for the current row
        numberOfLinksInCurrentRow = 0    }    
// move the Nth (numberOfLinksPerRow + 1) div to the current table row    
$('#promlink_row_' + currentRow).append($('.ms-promlink-body > .ms-tileview-tile-root:eq(' + (numberOfLinksPerRow) + ')'));    
// increment the number of links in the current row
    numberOfLinksInCurrentRow++;  }
}
});
</script>

我现在只想在我的页面上保留一个引用,传入参数3。

1 个答案:

答案 0 :(得分:0)

请按照以下步骤操作。

1。将下面的代码另存为js文件“ WrapPromotedLinks.js ”。

$(document).ready(function () {
    // Update this value to the number of links you want to show per row
    var numberOfLinksPerRow = 3;
    //alert(numberOfLinksPerRow);   
    // local variables
    var pre = "<tr><td><div class='ms-promlink-body' id='promlink_row_";
    var post = "'></div></td></tr>";
    var numberOfLinksInCurrentRow = numberOfLinksPerRow;
    var currentRow = 1
    // find the number of promoted links we're displaying
    var numberOfPromotedLinks = $('.ms-promlink-body > .ms-tileview-tile-root').length;
    // if we have more links then we want in a row, let's continue
    if (numberOfPromotedLinks > numberOfLinksPerRow) {
        // we don't need the header anymore, no cycling through links
        $('.ms-promlink-root > .ms-promlink-header').empty();
        // let's iterate through all the links after the maximum displayed link
        for (i = numberOfLinksPerRow + 1; i <= numberOfPromotedLinks; i++) {
            // if we're reached the maximum number of links to show per row, add a new row
            // this happens the first time, with the values set initially
            if (numberOfLinksInCurrentRow == numberOfLinksPerRow) {
                // i just want the 2nd row to
                currentRow++;
                // create a new row of links
                $('.ms-promlink-root > table > tbody:last').append(pre + currentRow + post);
                // reset the number of links for the current row
                numberOfLinksInCurrentRow = 0;    
            }    
            // move the Nth (numberOfLinksPerRow + 1) div to the current table row    
            $('#promlink_row_' + currentRow).append($('.ms-promlink-body > .ms-tileview-tile-root:eq(' + (numberOfLinksPerRow) + ')'));    
            // increment the number of links in the current row
            numberOfLinksInCurrentRow++;  
        }
    }
});

2。将该文件上载到站点资产库中的文件夹“ js-enterprise ”中。

3。使用SharePoint页面中脚本编辑器Web部件中的以下引用使它起作用。

<script src="https://code.jquery.com/jquery-1.12.4.min.js" type="text/javascript"></script>
<script type="text/javascript" src="../SiteAssets/js-enterprise/WrapPromotedLinks.js"></script>