在页面加载而不是 OnClick 时执行代码

Posted

技术标签:

【中文标题】在页面加载而不是 OnClick 时执行代码【英文标题】:Code Executing on Page Load instead of OnClick 【发布时间】:2021-12-30 21:02:06 【问题描述】:

我的代码在页面加载时执行了两次,尽管将代码添加到“点击”命令中。

我已经放置了代码'alert("Testing");'在与 'click(function(evt)' 有关的代码部分内 - 如果有人能告知我是否误解了此方法的功能,我将不胜感激,因为我假设后续括号内的代码只会在按钮点击。

如有任何见解,我们将不胜感激。

public static function get_javascript() 

            ob_start();
            ?>
            <script type="text/javascript">

                jQuery(document).ready(function() 
        
                    jQuery('#fpd-share-button').click(function(evt) 
                        alert("Testing");
                        evt.preventDefault();

                        jQuery(".fpd-share-widget, .fpd-share-url").addClass('fpd-hidden');
                        jQuery('.fpd-share-process').removeClass('fpd-hidden');
                        var scale = $selector.width() > 800 ? Number(800 / $selector.width()).toFixed(2) : 1;
                        fancyProductDesigner.getViewsDataURL(function(dataURLs) 

                            var dataURL = dataURLs[0],
                                data = 
                                action: 'fpd_createshareurl',
                                image: dataURL,
                                product: JSON.stringify(fancyProductDesigner.getProduct()),
                            ;
                            jQuery.post("<?php echo admin_url('admin-ajax.php'); ?>", data, function(response) 

                                if(response.share_id !== undefined) 

                                    var pattern = new RegExp('(share_id=).*?(&|$)'),
                                        shareUrl = window.location.href;

                                    if(shareUrl.search(pattern) >= 0) 
                                        //replace share id
                                        shareUrl = shareUrl.replace(pattern,'$1' + response.share_id + '$2');
                                    
                                    else
                                        shareUrl = shareUrl + (shareUrl.indexOf('?')>0 ? '&' : '?') + 'share_id=' + response.share_id;
                                    

                                    //append selected attributes of variable product
                                    var variationsSer = $productWrapper.find('.variations_form .variations select')
                                        .filter(function(index, element) 
                                            return $(element).val() != "";
                                        ).serialize();
                                    if(variationsSer && variationsSer.length > 0) 
                                        shareUrl += ('&' + variationsSer);
                                    
                                    <?php
                                        $shares = fpd_get_option('fpd_sharing_social_networks');
                                        $shares = str_replace(',"googleplus"', '', $shares);
                                    ?>
                                    jQuery(".fpd-share-widget").empty().jsSocials(
                                        url: shareUrl,
                                        shares: <?php echo is_array($shares) ? json_encode($shares) : '['.$shares.']'; ?>,
                                        showLabel: false,
                                        text: "<?php echo FPD_Settings_Labels::get_translation( 'misc', 'share:_default_text' ); ?>"
                                    ).removeClass('fpd-hidden');
                                

                                jQuery('.fpd-share-process').addClass('fpd-hidden');
                                jQuery('.fpd-share-url').attr('href', shareUrl).text(shareUrl).removeClass('fpd-hidden');

                            , 'json');

                        , 'transparent', multiplier: scale, format: 'png');
                    );
                <?php
                ?>
                );
            </script>
            <?php
            $output = ob_get_contents();
            ob_end_clean();

            return $output;
        
    

【问题讨论】:

你是对的,它会的。但是您的 JavaScript 似乎在这里不完整,所以以后可能会发生一些事情。提供问题的minimal reproducible example,以便我们更轻松地为您提供帮助。谢谢。 非常感谢您的回复。我刚刚编辑了帖子以包含代码。再次感谢。 【参考方案1】:

显然我无法对您的代码进行全面测试,因为缺少太多部分而无法重现问题和整个环境。但是我已经创建了我认为您想要实现的基本结构的骨架。而且它似乎有效。

您可以在这里在线尝试代码:https://www.w3schools.com/php/phptryit.asp?filename=tryphp_compiler 这是我发现的唯一一个可以混合使用 html、js 和 php 的网站。

<?php
    function get_javascript() 
        ob_start();
?>

        <script type="text/javascript">
            jQuery(document).ready(function() 
                jQuery('#fpd-share-button').click(function(evt) 
                    alert("Testing");
                    evt.preventDefault();
                );
            );
        </script>

<?php
        $output = ob_get_contents();
        ob_end_clean();

        return $output;
    
?>

<!DOCTYPE html>
<head>
<script
  src="https://code.jquery.com/jquery-3.6.0.min.js"
  integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
  crossorigin="anonymous"></script>

<?php
    echo get_javascript();
?>

</head>
<body>
    <button  id="fpd-share-button">SHARE</button>
</body>

</html>

【讨论】:

以上是关于在页面加载而不是 OnClick 时执行代码的主要内容,如果未能解决你的问题,请参考以下文章

加载页面时如何始终调用 onClick?错误:超过最大更新深度 [重复]

页面浏览计数器计数加 2 而不是 1

curl 库是不是在页面内执行 javascript?

在页面加载时使用类而不是输入id上的js自动对焦

jquery是怎么实现:页面加载完毕,而图片未加载完成时,触发的事件?

如何在onclick里执行java代码