Question

我有两个不同的按钮。点击时两者都运行JQuery函数'ShowCommentBox' 但是当单击第二个按钮时，我想在'SHowCommentBox'上加载一个额外的JQuery函数 - 这个附加功能允许在屏幕上显示额外的选项。

<input id="SubmitCommentsForBOQ" type="button" value="Comments" onclick="ShowCommentBox('<%: item.ItemCode %>'')" />

上面是我想要运行

的第二个按钮

 $("#SubmitCommentsForTwo").click(function () {
        $("#hiddenBox").show();
    });

，这使得额外功能可见......我该怎么做？

感谢您的回复

下面是原始的JQuery：它加载了一个对话框

function ShowCommentBox(itemIdentifier, labourOrPlant, desc) {
        id = itemIdentifier;
        LabouringOrPlanting = labourOrPlant;
        description = desc;
        Function.DisplayBox(itemIdentifier);
        $("#LabourOrPlantDialog").dialog({ modal: true }); 
    }

和我的其他代码：

    <div id="LabourOrPlantDialog" title="Comments"  style="display:none;">
 <table class="detailstable FadeOutOnEdit">
     <tr>
        <th>Item</th>
     </tr>
     <tr>
         <td id="Item"></td>
     </tr>
 </table>    
 <br />

       <textarea id="ExistingComments" type="text" runat="server" rows="7" cols="30"
        maxlength="2000"> </textarea> 
       <input id="SubmitComment" type="button" value="Submit"
            onclick="SubmitButton()" />  

<br />

<div id="hiddenBox">
<input type="text" name="BoqTextBox" id="BoqTextBox" value="7.15" />
</div>
</div>

Answer 1

最好separate behavior from markup。您可以使用HTML data-属性解决这两个问题。

首先在HTML中嵌入数据：

<input id="SubmitCommentsForBOQ" type="button" value="Comments"
    data-item-code="<%: item.ItemCode %>" />

而不是onclick，仅使用jQuery绑定事件处理程序，并立即执行所需的所有操作：

$("#SubmitCommentsForBOQ").click(function () {
    var itemCode = $(this).data('itemCode');
    ShowCommentBox(itemCode);
});

$("#SubmitCommentsForTwo").click(function () {
    $("#hiddenBox").show();
    var itemCode = $(this).data('itemCode');
    ShowCommentBox(itemCode);
});

多个处理程序将按照绑定的顺序执行，因此您也可以执行以下操作：

// happens first, but only for this specific button
$("#SubmitCommentsForTwo").click(function () {
    $("#hiddenBox").show();
});

// happens for all buttons
$("input[data-item-code]").click(function () {
    var itemCode = $(this).data('itemCode');
    ShowCommentBox(itemCode);
});

2个按钮一个有额外的功能

1 个答案: