Question

我有脚本，如下所示：

<div id="divContentRating">
<div id="divAskForRating">
    Yeni tasarımımızı beğendiniz mi?
    <br />
    <a id="likeIcon" href="javascript:void(0)"><img src="/Images/like.jpg"/></a>
    <a id="neutralIcon" href="javascript:void(0)"><img src="/Images/neutral.jpg"/></a>
    <a id="unlikeIcon" href="javascript:void(0)"><img src="/Images/unlike.jpg"/></a>
</div>
<div id="divPositiveRating">
    <div>
        <img src="/Images/like.jpg"/> Yeni tasarımımızı beğendiniz. <br />
        <a href="javascript:void(0)" class="updateRate">Güncelle</a>
    </div>
</div>
<div id="divNegativeRating">
    <div>
        <img src="/Images/unlike.jpg"/> Yeni tasarımımızı beğenmediniz. <br />
        <a href="javascript:void(0)" class="updateRate">Güncelle</a>
    </div>
</div>
<div id="divNeutralRating">
    <div>
        <img src="/Images/neutral.jpg"/> Yeni tasarımımız hakkında görüşünüz yok. <br />
        <a href="javascript:void(0)" class="updateRate">Güncelle</a>
    </div>
</div>
<div id="negativeRatingReasonDialog" style="display: none">
    <div>
        Yeni tasarımımızı beğenmediniz.<br />
        <textarea id="Comment" rows="3"></textarea><br />
    </div>
</div>

<input type="hidden" id="HasRated" value="false">
<input type="hidden" id="Rate" value="">
<input type="hidden" id="ContentKey" value="LANDING_PAGE">
<input type="hidden" id="RatingId" value="">
<input type="hidden" id="ParticipantId" value="">

<script type="text/javascript">
$(document).ready(function () {
    var protocol = location.protocol;
    var host = window.location.host;

    if ($("#HasRated").val() == "true")
    {
        var rate = $("#Rate").val();
        if (rate == 1) {
            setPositiveRatedView();
        }
        else if (rate == 0) {
            setNeutralRatedView();
        }
        else if (rate == -1) {
            setNegativeRatedView();
        }
        else {
            setNotRatedView();
        }
    }
    else {
        setNotRatedView();
    }

    $("#likeIcon").click(function () {
        setPositiveRatedView();
        ratePage(1, "");
    });

    $("#neutralIcon").click(function () {
        setNeutralRatedView();
        ratePage(0, "");
    });

    $("#unlikeIcon").click(function () {
        setNegativeRatedView();
        alert("hey");
        DisplayCommentPopup();
    });

    $(".updateRate").click(function () {
        setNotRatedView();
    });

    function DisplayCommentPopup()
    {
        var dialogDiv = $("#negativeRatingReasonDialog");

        var _options = {
            modal: true,
            closeOnEscape: false,
            width: 200, 
            height: 100, 
            close: function (ev, ui)
            {
                $(this).remove();
            },
            buttons: {
                "Paylaş": function() {
                    var comment = $("#Comment").val();
                    ratePage(-1, comment);
                    dialogDiv.dialog("close");
                },
                "Çıkış": function() {
                    ratePage(-1, "");
                    dialogDiv.dialog("close");
                }
            }
        };

        dialogDiv.dialog(_options);

        dialogDiv.dialog("open");
    }

    function setNotRatedView() {
        $("#divNeutralRating").fadeOut();
        $("#divPositiveRating").fadeOut();
        $("#divAskForRating").fadeIn();
        $("#divNegativeRating").fadeOut();
    }

    function setPositiveRatedView()
    {
        $("#divNegativeRating").fadeOut();
        $("#divNeutralRating").fadeOut();
        $("#divAskForRating").fadeOut();
        $("#divPositiveRating").fadeIn();
    }

    function setNegativeRatedView() {
        $("#divNeutralRating").fadeOut();
        $("#divPositiveRating").fadeOut();
        $("#divAskForRating").fadeOut();
        $("#divNegativeRating").fadeIn();
    }

    function setNeutralRatedView() {
        $("#divNegativeRating").fadeOut();
        $("#divPositiveRating").fadeOut();
        $("#divAskForRating").fadeOut();
        $("#divNeutralRating").fadeIn();
    }

    function ratePage(rating, comment)
    {
        var contentKey = $("#ContentKey").val();
        var hasRated = $("#HasRated").val();
        var ratingId = $("#RatingId").val();
        var participantId = $("#ParticipantId").val();

        var url = 
            protocol + '//' + host + '/ContentRating.aspx?contentKey=' + contentKey + '&rating=' + rating + '&ratingUpdate=' + hasRated + 
            '&ratingId=' + ratingId + '&participantId=' + participantId + '&comment=' + comment;

        $.ajax({
            url: url,
            dataType: 'json',
            type: 'POST', 
            cache: false,
            success: function( data ) {
                $("#HasRated").val(data.HasRated);
                $("#Rate").val(data.Rate);
                $("#ContentKey").val(data.ContentKey);
                $("#RatingId").val(data.RatingId);
                $("#ParticipantId").val(data.ParticipantId);
                $("#Comment").val(data.Comment);
                alert('HasRated: ' + data.HasRated + ' Rate: ' + data.Rate + ' ContentKey: ' + data.ContentKey + ' RatingId: ' + data.RatingId + ' ParticipantId: ' + data.ParticipantId + ' Comment: ' + data.Comment)
            },
            error: function( data ) {
                alert( 'ERROR:  ' + data );
            }
        });
    }
});

我在 DisplayCommentPopup 方法中打开的对话框只出现一次。第二次尝试它不起作用。我怎样才能找到问题？你有什么见解吗？

提前致谢，

Answer 1

关闭它时，将其删除，使其无法显示：

 close: function (ev, ui) {
            $(this).remove();
        },

顺便说一句，我会将对话框代码重新编写为：

var dialogDiv = $("#negativeRatingReasonDialog");
var _options = {
    modal: true,
    closeOnEscape: false,
    autoOpen:false,
    width: 300,
    height: 300,
    close: function (ev, ui) {
       // $(this).remove();
    },
    buttons: {
        "Paylaş": function () {
            var comment = $("#Comment").val();
            ratePage(-1, comment);
            dialogDiv.dialog("close");
        },
            "Çıkış": function () {
            ratePage(-1, "");
            dialogDiv.dialog("close");
        }
    }
};

dialogDiv.dialog(_options);

function DisplayCommentPopup() {
     dialogDiv.dialog("open");
}

这样，它只会获得一次“对话框”，然后您可以根据需要打开它：注意添加了autoOpen:false,选项。

Jqueryui对话框只运行一次

1 个答案: