需要在我使用 javascript 添加到我的页面的按钮的 onclick 事件上传递参数

Question

我有一个 javascript 包含在我的一些页面上，它将在页面上列出的任何联系人上创建一个按钮。该按钮的目的是使用户可以轻松地向该联系人发送电子邮件，并且该电子邮件将包含诸如站点 URL 之类的信息。我使用以下包含我的函数调用<script type="text/javascript" data-Subject="Site" src="../SiteAssets/js-test/AddContactButtons.js"></script>我的 AddContactButtons.js 有以下来源：$(document).ready(function() {      // Get the subject type    var this_js_script = $('script[src*=AddContactButtons]');    var subjectType = this_js_script.attr('data-Subject');     if (typeof subjectType == 'undefined' || subjectType == null || subjectType == ''){      subjectType = "Site";    }    //console.log('subjectType='+subjectType);    addContactButtons(subjectType);});function addContactButtons(subjectType){    var listTitle="Contacts";    console.log('addcontactButtons:subjectType='+subjectType);    $("table.ms-listviewtable[summary='"+listTitle+"']>tbody>tr").each(function(){        $(this).append("<input type='button' value='Help' style='background-color:#0072C5; color:white' class='btnSub' onclick='javascript:openMail(this);'>");    });}function openMail(btn){    var emailString = "mailto:";    var emailID = $(btn).prev("td").text()    //console.log(emailID);    console.log('openMail:subjectType='+subjectType);    emailString += emailID ;    emailString += "?Subject=SharePoint Site Support - Site=";    emailString += _spPageContextInfo.webServerRelativeUrl;;    //alert(emailString);    location.href=emailString;}问题是我尝试了很多不同的变体，但似乎无法将变量 subjectType 用于我的 openMail 函数。理想情况下，我想支持默认的站点支持主题，但我需要选择发送自定义主题或至少一些其他变体来告诉收到电子邮件的人它是用于支持自定义列表（应用程序） .

Answer 1

我有一个 javascript 包含在我的一些页面上，它将在页面上列出的任何联系人上创建一个按钮。该按钮的目的是使用户可以轻松地向该联系人发送电子邮件，并且该电子邮件将包含诸如站点 URL 之类的信息。

我使用以下包含我的函数调用

<script type="text/javascript" data-Subject="Site" src="../SiteAssets/js-test/AddContactButtons.js"></script>

我的 AddContactButtons.js 有以下来源：

$(document).ready(function() {  

    // Get the subject type

    var this_js_script = $('script[src*=AddContactButtons]');

    var subjectType = this_js_script.attr('data-Subject'); 

    if (typeof subjectType == 'undefined' || subjectType == null || subjectType == ''){

      subjectType = "Site";

    }

    //console.log('subjectType='+subjectType);

    addContactButtons(subjectType);

});

function addContactButtons(subjectType){

    var listTitle="Contacts";

    console.log('addcontactButtons:subjectType='+subjectType);

    $("table.ms-listviewtable[summary='"+listTitle+"']>tbody>tr").each(function(){

        $(this).append("<input type='button' value='Help' style='background-color:#0072C5; color:white' class='btnSub' onclick='javascript:openMail(this);'>");

    });

}

function openMail(btn){

    var emailString = "mailto:";

    var emailID = $(btn).prev("td").text()

    //console.log(emailID);

    console.log('openMail:subjectType='+subjectType);

    emailString += emailID ;

    emailString += "?Subject=SharePoint Site Support - Site=";

    emailString += _spPageContextInfo.webServerRelativeUrl;;

    //alert(emailString);

    location.href=emailString;

}

问题是我尝试了很多不同的变体，但似乎无法将变量 subjectType 用于我的 openMail 函数。理想情况下，我想支持默认的站点支持主题，但我需要选择发送自定义主题或至少一些其他变体来告诉收到电子邮件的人它是用于支持自定义列表（应用程序） .

Answer 2

选项 1：创建一个全局变量“subjectType”来实现它。修改代码如下。

var subjectType="";

$(document).ready(function() {  

    // Get the subject type

    var this_js_script = $('script[src*=AddContactButtons]');

    subjectType = this_js_script.attr('data-Subject'); 

    if (typeof subjectType == 'undefined' || subjectType == null || subjectType == ''){

      subjectType = "Site";

    }

    //console.log('subjectType='+subjectType);

    addContactButtons(subjectType);

});

function addContactButtons(subjectType){

    var listTitle="Contacts";

    console.log('addcontactButtons:subjectType='+subjectType);

    $("table.ms-listviewtable[summary='"+listTitle+"']>tbody>tr").each(function(){

        $(this).append("<input type='button' value='Help' style='background-color:#0072C5; color:white' class='btnSub' onclick='javascript:openMail(this);'>");

    });

}

function openMail(btn){

    var emailString = "mailto:";

    var emailID = $(btn).prev("td").text()

    //console.log(emailID);

    console.log('openMail:subjectType='+subjectType);

    emailString += emailID ;

    emailString += "?Subject=SharePoint Site Support - Site=";

    emailString += _spPageContextInfo.webServerRelativeUrl;;

    //alert(emailString);

    location.href=emailString;

}

方案二：使用jQuery代码实现点击事件。

$(document).ready(function() {  

    // Get the subject type

    var this_js_script = $('script[src*=AddContactButtons]');

    var subjectType = this_js_script.attr('data-Subject'); 

    if (typeof subjectType == 'undefined' || subjectType == null || subjectType == ''){

      subjectType = "Site";

    }

    //console.log('subjectType='+subjectType);

    addContactButtons(subjectType);

});

function addContactButtons(subjectType){

    var listTitle="Contacts";

    console.log('addcontactButtons:subjectType='+subjectType);

    $("table.ms-listviewtable[summary='"+listTitle+"']>tbody>tr").each(function(){       

        $(this).append("<input type='button' value='Help' style='background-color:#0072C5; color:white' class='btnSub'>");

    });

    $("table.ms-listviewtable[summary='"+listTitle+"']>tbody>tr input[value='Help']").click(function(){

        openMail($(this),subjectType);

    });

}

function openMail(btn,subjectType){

    var emailString = "mailto:";

    var emailID = $(btn).prev("td").text()

    //console.log(emailID);

    console.log('openMail:subjectType='+subjectType);

    emailString += emailID ;

    emailString += "?Subject=SharePoint Site Support - Site=";

    emailString += _spPageContextInfo.webServerRelativeUrl;;

    //alert(emailString);

    location.href=emailString;

}

Answer 3

我建议向click按钮添加一个处理程序，而不是使用该onclick属性，以便您可以明确地传入所需的参数。

那是：

const button = $("<input type='button' value='Help' style='background-color:#0072C5; color:white' class='btnSub'>");

button.click(() => openMail(button, subjectType));

$(document).ready(function() {  

    // Get the subject type

    var this_js_script = $('script[src*=AddContactButtons]');

    var subjectType = this_js_script.attr('data-Subject'); 

    if (typeof subjectType == 'undefined' || subjectType == null || subjectType == ''){

      subjectType = "Site";

    }

    //console.log('subjectType='+subjectType);

    addContactButtons(subjectType);

});

function addContactButtons(subjectType){

    var listTitle="Contacts";

    console.log('addcontactButtons:subjectType='+subjectType);

    $(".container").each(function(){

      const button = $("<input type='button' value='Help' style='background-color:#0072C5; color:white' class='btnSub'>");

      button.click(() => openMail(button, subjectType));

      $(this).append(button);

    });

}

function openMail(btn, subjectType){

  console.log('openMail:subjectType='+subjectType);

  /*

  var emailString = "mailto:";

  var emailID = $(btn).prev("td").text()

  //console.log(emailID);

  console.log('openMail:subjectType='+subjectType);

  emailString += emailID ;

  emailString += "?Subject=SharePoint Site Support - Site=";

  emailString += _spPageContextInfo.webServerRelativeUrl;;

  //alert(emailString);

  location.href=emailString;

  */

}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script type="text/javascript" data-Subject="Site" src="../SiteAssets/js-test/AddContactButtons.js"></script>

<div class="container"></div>

<div class="container"></div>

正如@Bavo 所说，您当前实施的内容存在范围和上下文问题。