当有人确认时让jQuery点击一个按钮(对话框)

我有一个 wordpress 拍卖网站,当有人点击“出价”按钮时,我想用 jquery 添加一个确认对话框。我可以使用默认的系统对话框来实现这一点,但我想要一个带有 jQuery 的更自定义的对话框。最终用户确认出价后,如何让它点击出价按钮?


这是代码示例:


            <button type="submit" class="bid_button button alt"><?php echo wp_kses_post( apply_filters( 'bid_text', esc_html__( 'Bid', 'auctions-for-woocommerce' ), $product ) ); ?></button>

            <script>

                jQuery('button').confirm({

                    title: 'titletext',

                    content: 'content text"',

                    type: 'red',

                    buttons: {   

                        ok: {

                            text: "OK",

                            btnClass: 'btn-primary',

                            keys: ['enter'],

                            action: function(){

                                 console.log('Brukeren bekreftet "OK"');

                            }

                        },

                        No: function(){

                                text: "No",

                                jQuery.alert('Kansellert!');

                                console.log('the user clicked cancel');

                        }

                    }

                });

            </script>


哔哔one
浏览 141回答 1
1回答

慕工程0101907

似乎这个库不是为通过按钮提交表单而创建的,更像是将它用于 <a>标签,源 - https://github.com/craftpip/jquery-confirm/issues/229我想我会给你一个方法来解决你的问题。现在我正在阻止按钮未确认时的默认行为,并在确认时再次触发它,但这次按钮可以提交表单。还将 id 添加submitButton到您的按钮以使其个性化。<button type="submit" id="submitButton" class="bid_button button alt"></button><script>&nbsp; &nbsp;var confirmed = false;&nbsp; &nbsp;$('#submitButton').on('click', function() {&nbsp; &nbsp; &nbsp;if (!confirmed) {&nbsp; &nbsp; &nbsp; &nbsp;event.preventDefault();&nbsp; &nbsp; &nbsp; &nbsp;$.confirm({&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;title: 'titletext ',&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;content: 'content text"',&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;type: 'red',&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;buttons: {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;ok: {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;text: "OK",&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;btnClass: 'btn-primary',&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;keys: ['enter'],&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;action: function() {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;confirmed = true;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;$('#submitButton').click()&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;console.log('Brukeren bekreftet "OK"');&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;}&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;},&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;No: function() {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;text: "No",&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;jQuery.alert('Kansellert!');&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;console.log('the user clicked cancel');&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;}&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;}&nbsp; &nbsp; &nbsp; &nbsp;})&nbsp; &nbsp; &nbsp;} else {&nbsp; &nbsp; &nbsp; &nbsp;confirmed = false&nbsp; &nbsp; &nbsp;}&nbsp; &nbsp;})</script>希望我能帮助你。:)
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript