一个按钮中有两个onClick功能,希望一个接一个地发生单击功能

时间:2016-04-26 07:12:16

标签: javascript jquery html asp.net asp.net-mvc

其实我试图在点击按钮时添加一个对话框。但是在该按钮的OnClick功能上,我已经调用了控制器的功能。 HTML代码是:

<div class="pro-btn btn">
                        @{
<input type="button" id="place-bid-button-@Model.ProductId" class="button-1"value="@T("Nopaholics.Auction.AuctionDetailView.PlaceBid")" data-   productid="@Model.ProductId" 
onclick="Auction.placeBid('@Url.RouteUrl("Nopaholics.Auction.PlaceBid", new { productId = Model.ProductId, auctionId = Model.AuctionId })', '#product-details-form');return false;" />
}
</div>   

现在在jquery下面写完后,两个点击功能同时工作。但我想首先通过单击对话框的OK按钮和要调用的控制器动作来确认。

<script> 
$('#place-bid-button-'+@Model.ProductId.ToString()).click(function(e){

$( "#dialog-confirm" ).dialog({
    resizable: false,
    height:160,
    modal: true,
    buttons: {
        "OK": function() {
            $( this ).dialog( "close" );
            $("#place-bid-button-@Model.ProductId.ToString()").click();
            },
            Cancel: function(e) {
                $( this ).dialog( "close" );
                $('#place-bid-button-'+@Model.ProductId.ToString()).die();
                console.log(e);
                //return false;
                //e.preventDefault();
            }
        }
    });
});
</script>

任何帮助将不胜感激。提前谢谢..

3 个答案:

答案 0 :(得分:2)

您不需要多项功能。我建议完全摆脱内联点击处理程序。

您可以使用data-*前缀自定义属性存储网址,该属性可以使用HTMLElement.dataset属性获取。

HTML

@{
    <input type="button" class="place-bid-button button-1"
            value="@T("Nopaholics.Auction.AuctionDetailView.PlaceBid")" 
            data-url="@Url.RouteUrl("Nopaholics.Auction.PlaceBid", new { productId = Model.ProductId, auctionId = Model.AuctionId })"
            data-form="#product-details-form"/>
}

然后您可以使用以下脚本

//Bind click hndler using a common class
$('.place-bid-button').click(function(e) {
    //Store the refrence in a variabled
    var self = this;

    $("#dialog-confirm").dialog({
        resizable: false,
        height: 160,
        modal: true,
        buttons: {
            "OK": function() {
                //Cal the method with url and form name
                Auction.placeBid(self.dataset.url, self.dataset.form);
                $(this).dialog("close");

            },
            Cancel: function(e) {
                $(this).dialog("close");
            }
        }
    });
});

答案 1 :(得分:0)

将该功能写在单个onclick属性上,例如:onclick="firstFunction();SecondFunction();"

如果在firstFunction中有confirm/alert框,那么confirm/alert函数会停止执行代码,直到它被解除。这意味着当firstFunction确认关闭时将调用secondFunction。

答案 2 :(得分:0)

您想要点击按钮执行某些操作,仅当用户点击确认对话框确定时,   因此,您需要点击“确定”来调用“操作方法”/“操作代码”(您需要采取的操作)。对话框的按钮代替调用&#39; click()&#39;再次明确行动。