Home Web Front-end H5 Tutorial Detailed explanation of HTML5 address book to obtain information of specified multiple people

Detailed explanation of HTML5 address book to obtain information of specified multiple people

May 21, 2017 pm 07:09 PM
html html5

This article mainly introduces the detailed explanation of HTML5+ address book to obtain the information of multiple specified people. It is of great practical value and friends in need can refer to it.

This article introduces the HTML5 address book to obtain the information of multiple specified people. The details are as follows:

1. Obtaining the information of multiple people: Before importing the information of multiple people in the address book, it is necessary to solve the problem of obtaining information. Information about multiple individuals. I obtained the IDs and displayNames of all contacts in the address book through the application of plus.contacts.getAddressBook and address.find, and then displayed them through the address book acquisition page I wrote.

1. To solve this problem, first you have to write a js address book yourself, so that the initials of all your contacts can be separated, and you can jump to the initials you want next to them.

2. Solve the problem of obtaining all contact information


plus.contacts.getAddressBook(plus.contacts.ADDRESSBOOK_PHONE, function(addressbook) { //获取通讯录信息
                // 可通过addressbook进行通讯录操作
                addressbook.find(null, function(contacts) {
                    var username = new Array();
                    var LinkList = new LinkedList();
                    if(contacts.length > 0) { //获取当前通讯录里面所有人
                        for(var i = 0; i < contacts.length; i  ) {
                            username[i] = contacts[i].displayName   "-"   contacts[i].id; //连接id和username,为后面筛选最准备
                        }
                        //这下面的代码是把所有联系人的信息分类,这就涉及到了自己写的JS页面代码
                        LinkList = sortPY(username); //把联系人数组分类
                        //LinkList.show();
                        createLiCheckBox(LinkList); //分类信息显示至页面,我使用checkBox进行多个联系人选择
                    }

                }, function(e) {
                    alert("Find contact error: "   e.message);
                });

            }, function(e) {

    });

2. Import multiple selected personal information from the address book: Solve this problem in the previously created When entering the address book page, the contact's ID must be placed on the page (hidden using display), so that when I obtain the selected checkBox, I can directly obtain the ID and put these IDs into an array. Then filter out the contact information of these IDs through the application of plus.contacts.getAddressBook and address.find.

1. To solve the problem of using checkBox to get the contact id, here I used JQuery.


//筛选已经被选中的checkbox
    $("input:checked").each(function() {
            var index = $(this).parent().prev().children(&#39;label&#39;).text(); //获取id
            var name = $(this).parent().prev().children(&#39;p&#39;).text(); //获取姓名
            username.push(name);
            usernameIndex.push(index);
    });

2. To solve the problem, put these indexes into find to filter the information, and take out the contact information under the specific ID


plus.contacts.getAddressBook(plus.contacts.ADDRESSBOOK_PHONE, function(addressbook) { //获取通讯录信息
            for(var j = 0; j < username.length; j  ) {//循环所选取的联系人,记得循环一定要放在这里,一开始我放在        plus.contacts.getAddressBook外面是错误
                        addressbook.find(null, function(contacts) {
                            console.log("进入查询");
                            for(var i = 0; i < contacts.length; i  ) {//无论是否为多个信息,一定要循环数组
                                console.log("进入循环");
                                //var id = contacts[i].id;
                                var displayname = contacts[i].displayName;
                                var phone = "";
                                var emails = "";
                                var dates = "";
                                var remark = "";
                                if(contacts[i].phoneNumbers.length > 0) {//这里需要判断是否为空,为空的数组没有index=0;
                                    phone = contacts[i].phoneNumbers[0].value;
                                } else {
                                    phone = contacts[i].phoneNumbers;
                                }

                                if(contacts[i].emails.length > 0) {//这里需要判断是否为空,为空的数组没有index=0;
                                    emails = contacts[i].emails[0].value;
                                } else {
                                    emails = contacts[i].emails;
                                }

                                var dateNum = new Date(contacts[i].birthday);//这里的birthday是number类型!!!官方手册坑爹?
                                dates = dateNum.getFullYear()   "."   (dateNum.getMonth()   1)   "."   dateNum.getDate();
                                remark = contacts[i].note;

                                var getContact = {//把所有信息放到一个json里面
                                    contactName: displayname,
                                    sex: "",
                                    department: "",
                                    positions: "",
                                    tel: "",
                                    phone: phone,
                                    eMail: emails,
                                    birthday: dates,
                                    hobby: "",
                                    remark: remark
                                };

                                //这下面是我的业务代码了,这里大家可以写自己的信息
                                //createContactTable(db);
                                //InsertContact(db, getContact); //多个信息插入有线程安全的问题出现!!!!!!!
                            }
                            //console.log(username.length);                         
                        }, function(e) {
                            console.log("查询错误");
                        }, {  
                                                         //这里面的筛选非常重要!!!这样才能选出匹配的信息
                            filter: [{
                                logic: "or",
                                field: "id",
                                value: usernameIndex[j]
                            }],
                            multi: false
                        });
                    }
                }, function(e) {
                    console.log("打开通讯录错误");
                });

The above is the detailed content of Detailed explanation of HTML5 address book to obtain information of specified multiple people. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undress AI Tool

Undress AI Tool

Undress images for free

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

Hot Topics

PHP Tutorial
1506
276
How to highlight text with the  tag? How to highlight text with the tag? Aug 04, 2025 pm 04:29 PM

Use tags to highlight text semantically, often used to identify search results or important content; 2. Custom styles such as background colors, text colors and borders can be customized through CSS; 3. It should be used in contexts with practical significance, rather than just visual decoration to improve accessibility and SEO effects.

How to use HTML to create a link that opens in a new tab How to use HTML to create a link that opens in a new tab Aug 05, 2025 am 04:29 AM

To safely open a link in a new tab, you need to use target="_blank" and always cooperate with rel="noopener". You can choose rel="noreferrer" to enhance privacy protection. The specific steps are: 1. Use href to set the target URL; 2. Add target="_blank" to open the link in a new tab; 3. Add rel="noopener" to prevent the new page from manipulating the original page and improving performance; 4. You can choose rel="noreferrer" to prevent sending

What are HTML5 data attributes? What are HTML5 data attributes? Aug 06, 2025 pm 05:39 PM

HTML5dataattributesarecustom,validHTMLattributesusedtostoreextrainformationinelementsforJavaScriptorCSS.1.Theyaredefinedasdata-*attributes,likedata-user-id="123".2.Theyallowembeddingprivate,customdatadirectlyinmarkupwithoutaffectinglayoutor

What are the supported audio formats in HTML5? What are the supported audio formats in HTML5? Aug 05, 2025 pm 08:29 PM

HTML5 audio format support varies from browser to browser. The most commonly used formats include: 1.MP3 (.mp3, audio/mpeg, supported by all mainstream browsers, with the best compatibility); 2.WAV (.wav, audio/wav, support better but large files, suitable for short audio); 3.OGG (.ogg/.oga, audio/ogg, Chrome, Firefox, Opera support, Safari and IE are not supported, open source free); 4.AAC (.aac/.m4a, audio/aac, Safari, Chrome, Edge support, Firefox support is limited, often used in Apple devices). To ensure compatibility, the

How to use the HTML abbr tag for abbreviations How to use the HTML abbr tag for abbreviations Aug 05, 2025 pm 12:54 PM

Using HTML tags can improve the accessibility and clarity of content; 1. Mark abbreviations or acronyms with abbreviations; 2. Add title attributes to unusual abbreviations to provide a complete explanation; 3. Use when the document first appears, avoiding duplicate annotations; 4. You can customize the style through CSS, and the default browser usually displays dotted underscores; 5. It helps screen reader users understand terms and enhance user experience.

How to use HTML for basic text formatting How to use HTML for basic text formatting Aug 05, 2025 pm 03:05 PM

Useforboldandsemanticimportance,andforitalicandemphasisinsteadoforforbetteraccessibilityandSEO.2.Structurecontentwithheadingtagsto,anduseforsmallertextlikedisclaimers.3.Separateparagraphswithandinsertlinebreakswithinparagraphsusingtheself-closingtag.

How do you loop an audio or video file in HTML5? How do you loop an audio or video file in HTML5? Aug 06, 2025 am 12:13 AM

To make the audio or video file loop in HTML5, just add the loop attribute in the audio or video tag. 1. For basic loops, add loop attributes directly to the audio or video element, for example, or will automatically start from scratch after playback. 2. If you need to play and loop automatically, you can combine the autoplay, loop and muted properties, especially suitable for background videos, such as. 3. The loop state can be controlled through JavaScript, and set video.loop=true to enable or video.loop=false to disable. 4. If you need to accurately loop a specific time period, you need to use JavaScript to listen to the time and manually set cur

What is the doctype in HTML5? What is the doctype in HTML5? Aug 06, 2025 am 01:15 AM

It is a necessary tag used in HTML5 to declare document types and must be located at the beginning of the document; its function is to ensure that the browser renders the page in standard mode to avoid compatibility issues caused by the lack of declarations; the declaration is concise, case-insensitive and does not require reference to DTD; correct use can ensure the expected behavior of HTML, CSS and JavaScript.

See all articles