简单脚本的奇怪行为

时间:2014-07-17 07:13:14

标签: jquery forms

我希望我能够获得更好的成绩。但我甚至不知道我的问题在哪个球场。

我正在尝试建立一些让我问“你真的想要?”的东西。用户发送或保存表单后。这是我的小提琴:http://jsfiddle.net/chrystalingus/zXUQ4/

$('.confirm_this').click(function(e){
    e.preventDefault();
    var modal_markup = '<div id="modal_confirm"></div>';
    $('body').append($(modal_markup));

            var send_button = $(this);
            var formular = send_button.parent();
            var formular_width = formular.outerWidth();
            var formular_height = formular.outerHeight();
            var reset_button_markup = '<input id="reset_button" type="reset" value="No">';
                $(reset_button_markup).insertAfter(send_button);
            var reset_button = $('#reset_button');
            var orig_send_value = send_button.attr('value');
            var form_marker_markup = '<div id="form_marker"></div>'; // placeholder for the form which temporarily goes into the modal overlay (and to find it's original location later)
                $(form_marker_markup).insertAfter(formular);
            var form_marker = $('#form_marker');
                form_marker.css({
                    'width': formular_width+'px',
                    'height': formular_height+'px'
                });
            var modal = $('#modal_confirm');

            send_button.unbind();
            formular.children().hide();
            send_button.attr('value', 'Yes').show();
            reset_button.show();
            formular.appendTo(modal);
            modal.show();

            reset_button.click(function(e){
                e.preventDefault();
                formular.insertBefore(form_marker);
                form_marker.remove();
                modal.remove();
                reset_button.unbind().remove();
                send_button.attr('value', orig_send_value).unbind();
                formular.children().show();
                confirm();
            });
});

这适用于任何形式 - 无论输入类型,布局等。

我对此很新,并且意识到我的jquery代码相当笨拙和原始 - 但应该仍然有效。 所以基本上我试图抓住并阻止点击按钮class =“confirm_this”。整个(隐藏)表单再次以模态覆盖方式放置,前一个“发送”按钮现在是“是”按钮。

它似乎工作正常,如果我在页面上只有一个表单,我想问题永远不会发生。但是,只要我在页面上有2个表单,就会发生这种情况: 我点击发送表格A - 模态 - “不” - 重复 - 重复 然后我点击发送表格B - 模态 - (目前为止都很好) - “不”......结果:不过我经常重复表格A的过程 - 那就是表格B旁边的页面中出现了多少“否”按钮身体结束前我也有很多。 这只发生在浏览器中,在jsfiddle我得到一个警告“未定义”但我不知道还没有定义什么... Chrome控制台什么都没有。

Thanx为你提供帮助......

0 个答案:

没有答案