将点击事件绑定到 Google 自定义搜索结果

Question

我正在使用 Google 自定义搜索来获取搜索查询的结果。结果很好。我现在需要在生成的结果上捕获点击事件。
到目前为止，我已经尝试了以下方法：

<script>
    (function () {
        window.__gcse = {
            callback: myCallback
        };

        function myCallback() {
            $('input.gsc-input').keyup(function (e) { if (e.keyCode == 13 || e.which == 13) { console.log('enter pressed'); } });
            $('input.gsc-search-button').on('click', function (e) { console.log('clicked'); });
            $('a').on('click', function (e) {
                alert();
                e.preventDefault();
                e.stopPropagation();
                debugger;
                var obj = $(this);
            });
        }

        var cx = 'my-gcse-id';
        var gcse = document.createElement('script');
        gcse.type = 'text/javascript';
        gcse.async = true;
        gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
            '//www.google.com/cse/cse.js?cx=' + cx;
        var s = document.getElementsByTagName('script')[0];
        s.parentNode.insertBefore(gcse, s);
    })();


</script>

<gcse:search linktarget="_parent" enableAutoComplete="true"></gcse:search>

上面给了我点击输入搜索框和按钮的控制台日志，而不是点击搜索结果中的链接。 我也尝试过 window.load 和 document.ready 但无法正常工作。

<script>
    $(window).on("load", function () {

        $('#gsc-i-id1').css('background', '');
        $('#gsc-i-id1').on("blur", function (e) {

            $(this).css('background', '');
        });
        $("a").on("click", function (e) {
            alert();
            e.preventDefault();
            debugger;
            var obj = $(this);
        });
    });
    $(document).ready(function () {

        $('#gsc-i-id1').css('background', '');
        $("a").on("click", function (e) {
            e.preventDefault();
            debugger;
            var obj = $(this);
        });
    });
  </script>

请各位专家帮助我实现这一目标。

Answer 1

您的代码对我有用 ,,,!!您需要做的就是在 a.clicked 上添加对 alert() 的调用 这意味着在您的代码中找到以下 sn-p

$(window).on("load", function () {

    $('#gsc-i-id1').css('background', '');
    $('#gsc-i-id1').on("blur", function (e) {

        $(this).css('background', '');
    });
    $("a").on("click", function (e) {
        alert();
        e.preventDefault();
        debugger;
        var obj = $(this);
    });
});

替换成

      $(window).on("load", function () {

        $("a").on("click", function (e) {
            alert();
            e.preventDefault();
            debugger;
            var obj = $(this);
        });
    });

我必须提到我没有使用默认的谷歌自定义搜索模板我已经制作了我自己的搜索框和我使用两列模板，所以在我的情况下，窗口永远不会模糊,,,我很确定你一定已经想到了不过现在已经解决了..loll

使用 ti 一段时间后，我意识到它适用于没有广告的结果页面。如果您有带有广告的页面，当您点击广告时.. 广告文本在一个跨度中，这就是为什么 a.onclick 事件不会停止默认行为