2

在下面的代码中，当我单击“投票”时，会显示投票结果屏幕，但是当我单击“返回投票”时，投票会重新显示，但“显示选项”按钮不再可见。单击“返回投票”时，是否有办法防止隐藏此按钮。

这是小提琴：http: //jsfiddle.net/E2gku/2/

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

<script type="text/javascript" charset="utf-8" src="http://static.polldaddy.com/p/5968383.js"></script>
<noscript><a href="http://polldaddy.com/poll/5968383/">This is a test question ?</a></noscript>

<style>
.pds-pd-link {
display: none !important;
}
.pds-box {
    width: 200px !important;
}
.pds-input-label{
    width: auto! important;
}
.PDS_Poll{
    margin-bottom:15px;
}


</style>
<script type="text/javascript">



$(document).ready(function() {

    $('.pds-question').append('<input type="button" class="showanswer" value="Show Options"/>');

        $('.pds-vote').css('display' , 'none');
        $('.pds-answer').css('display' , 'none');
        $('.pds-vote-button').css('display' , 'none');
        $('.pds-view-results').css('display' , 'none'); 

    $('.showanswer').on('click', function () {

            $('.pds-vote').show();
             $('.pds-answer').show();
             $('.pds-vote-button').show();
             $('.pds-view-results').show();

        $('.showanswer').hide();
        $('.pds-question').append('<input type="button" class="hideanswer" value="Hide Options"/>');

        $('.hideanswer').on('click', function () {
                $('.pds-vote').hide();
                 $('.pds-answer').hide();
                 $('.pds-vote-button').hide();
                 $('.pds-view-results').hide();
                $('.showanswer').show();
                 $('.hideanswer').hide();
        });

});

});
</script>
4

2 回答 2

1

当用户单击返回问题时，您可以使用事件委托重新附加按钮：

$('body').on('click', '.pds-return-poll', function() {
    setTimeout(function(){
        $('.pds-question').append('<input type="button" class="showhideanswer" value="Hide Options"/>');
    }, 10);
});

我也干了你的代码，只是一点点：

$(document).ready(function() {
    $('.pds-answer, .pds-vote').css('display' , 'none');
    $('.pds-question').append('<input type="button" class="showhideanswer" value="Show Options"/>');

    $('body').on('click', '.pds-return-poll', function() {
        setTimeout(function(){
            $('.pds-question').append('<input type="button" class="showhideanswer" value="Hide Options"/>');
        }, 10);
    }).on('click', '.showhideanswer', function() {
        $('.pds-answer, .pds-vote').toggle();
        if (this.value == 'Show Options')
            $(this).val('Hide Options');
        else
            $(this).val('Show Options');
    });
});

JSF中。

超时是因为您的默认函数优先，因此将此超时解释为延迟对象。

显然，随着按钮是动态添加的，它还需要事件委托，就像我上面的代码一样（或者重新绑定事件处理程序，你可以选择）。

​<strong>edit：修复了 Firefox 中的一个错误。

编辑2：再干一点。选择器现在只使用一次，所以我放弃了选择器缓存，因为$(document).ready' 选择器不能在showhideanswer'click处理程序中重复使用，因为出于某种原因，您的插件开发人员决定在您转到结果页面并返回投票页面，而不是重新使用相同的元素。

于 2012-07-02T22:52:45.873 回答
0

Polldaddy 不会隐藏您的按钮，而是会替换.innerHTMLof#PDI_container5968383并因此完全删除您的新按钮。看看PDV_go5968383()PD 脚本中的函数：

function PDV_go5968383(){
    /* other code */
    // PDV_html5968383 is prepared HTML for the container
    _$("PDI_container5968383").innerHTML = PDV_html5968383;
    /* other code */
}

这将删除您添加的所有内容。您可以在 PD 容器之外添加按钮并使用 CSS 定位它们。这将防止它们被删除。

于 2012-07-02T21:58:56.387 回答