Do you know any opensource JQuery dropdown menu fo

2020-07-18 06:25发布

站内问答 / jQuery
524 3 4

I need to do a dropdown menu for entering telephone numbers. I want to do something similar as google does in his registration form. Something like this:

enter image description here

Do you know any opensource dropdown menu for telephone prefix?

I have looking in google and the most similar thing I have found is this menu. I can modify it to do what I want but it will take time and I think maybe someone has already did something similar.

NOTE: The link I am sharing contains only countries and flags. I am looking for a full dropdown containing flags, country names, country names in original language, ability to add a country first ignoring alphabetical order and international phone prefixes.

3条回答
傲
2楼-- · 2020-07-18 06:35

I also needed this, so I built it.

Here is a live demo.

It currently has the following features:

  • In the country dropdown you can navigate by typing, or using the up/down keys
  • Selecting a country updates the dial code of the entered number
  • Typing a different dial code automatically updates the displayed flag
  • Option to specify "preferred countries" (which appear at the top of the list)

I built it out of the following open source projects:

查看更多
0人赞 添加讨论(0) 举报
smile是对你的礼貌
3楼-- · 2020-07-18 06:40

Well, you need a database which contains all the details of the phone-numbers, then you need to query the database through Ajax, return the results via Ajax too, and display it. After getting the results, you can create a div or p element of your own, populate them with the incoming data, and display it. if you don't want to do that, use jQuery UI Autocomplete.

查看更多
0人赞 添加讨论(0) 举报
劫难
4楼-- · 2020-07-18 06:55 

<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/6.4.1/js/intlTelInput.min.js"></script>
<script type="text/javascript">
  $("#mobile-number").intlTelInput();
</script>
<head>
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/6.4.1/css/intlTelInput.css">
  <title></title>
 </head>
<input type="tel" id="mobile-number" placeholder="e.g. +1 702 123 4567">

its work fine there is no probelm in code may be it will help for you thanks

header link https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/6.4.1/css/intlTelInput.css scripts http://code.jquery.com/jquery-latest.min.js https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/6.4.1/js/intlTelInput.min.js

java code $("#mobile-number").intlTelInput(); form code

查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(4)