Jquery在点击时显示字符串(电话:)

时间:2017-09-26 14:06:34

标签: jquery

默认情况下尝试隐藏电话号码,强制使用"点击以显示"。最重要的是,添加相关的事件跟踪,以便我们可以使用Google分析事件跟踪来跟踪点击次数。

我试过这个剧本:

<RelativeLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/ans_bg_normal"
            android:padding="@dimen/padding25"
            android:gravity="center_vertical"
            >
            <com.app.quizjeetho.Fonts.TextView_Bold
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="@drawable/ans_circle_normal"
                android:id="@+id/option1_a"
                />

            <com.app.quizjeetho.Fonts.TextView_Bold
                android:id="@+id/option1"
                android:textSize="15sp"
                android:textColor="@color/white"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="asdsdddadsadasdasdsadasdsadddsf"
                android:layout_centerInParent="true"
                />
        </RelativeLayout>

默认使用以下格式隐藏最后4位数字:

$(document).ready(function() { var phonenumbers = []; $(".phonenumber").each(function(i) { phonenumbers.push($(this).text()); var newcontent = $(this).text().substr(0, $(this).text().length - 4) $(this).text(newcontent); $(this).bind("click", function() { if ($(this).text() == phonenumbers[i]) { $(this).text(phonenumbers[i].substr(0, phonenumbers[i].length - 4)); } else { $(".phonenumber").each(function(x) { if ($(this).text() == phonenumbers[x]) { $(this).text(phonenumbers[x].substr(0, phonenumbers[x].length - 4)); } }); $(this).text(phonenumbers[i]); } }); }); });

但是id喜欢使用完全不同的锚文本,隐藏整个电话号码,直到点击新的锚文本。

1 个答案:

答案 0 :(得分:2)

您不需要AJAX进行跟踪;如果您尝试使用Google Analytics等功能对其进行跟踪,则可以在点击结果时触发分析中的事件。

有几种方法可以做到这一点,有些人可能会尝试将电话号码隐藏在绝对定位的元素后​​面,该元素表示&#34;显示&#34;。我选择只使用href来获取数字并替换元素的文本。

$(document).ready(function(){

        // Use one instead of on so that you're only preventing default once
        $('a[href^="tel:"]').one('click', function(e){

             e.preventDefault();

             // Gets the string from the href and removes anything not a digit
             var phone_number = $(this).attr('href').replace(/\D/g,'');

             // 044 802 52578
             var phone_formatted = phone_number.substr(0, 3);
             phone_formatted += ' ' + phone_number.substr(3, 3);
             phone_formatted += ' ' + phone_number.substr(6);

             // Trigger your analytics event
             // ga is used by Google Analytics, 
             // it must be loaded before you do this
             ga('send', {
                hitType: 'event',
                eventCategory: 'Interaction',
                eventAction: 'click-reveal-phone',      
                eventLabel: 'Phone Number Revealed',
                eventValue: 0,
                nonInteraction: true
            });
            // The above could be written like this as well
            // ga('send', 'event', 'Interaction', 'click-reveal-phone', 'Phone Number Revealed');


             $(this).text(phone_formatted);

    })

})

Here is a jsFiddle