Я хочу включить автозаполнение jquery, когда пользователь вводит @ - PullRequest
2 голосов
/ 27 августа 2010

Я хочу использовать jQuery autocomplete , когда пользователь вводит @ в текстовое поле для ввода адреса электронной почты

когда пользователь вводит @ afrer, набирая свой список имен доменов с идентификатором электронной почты, например @ gmail.com, hotmail.com, yahoo.com должен иметь значение

заполняется, чтобы пользователь мог выбрать его вместо того, чтобы вводить его из автозаполнения.

Я пытался, но он не работает

мой код

<!DOCTYPE html>
<html>
<head>
  <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

  <script type="text/javascript">

  $(document).ready(function() {

      var autocompOpts = {
          minChars:0,
          matchSubset:false,
          matchContains: true,
          disabled: true,
          source : ["@gmail.com", "@yahoo-inc.com", "@yahoo.com", "@yahoo.co.in", "@rediff.com", "@rediffmail.com", "@hotmail.com", "@msn.com", ]           
      };    

      $("input#autocomplete").autocomplete(autocompOpts);

      $("input#autocomplete").bind('keyup', function(event) {

          if(event.shiftKey==1)
          { 
              if(event.keyCode==50)
              {     
                  $("input#autocomplete").autocomplete( "option", "disabled", false );
                  var opt = $("input#autocomplete").autocomplete( "option", "disabled");
                  alert(opt);
              }
          }
      });
  });
  </script>
</head>
<body style="font-size:62.5%;">
  <center>
<input id="autocomplete" />

</body>
</html>

Ответы [ 2 ]

1 голос
/ 28 августа 2010

Вот так: На jsfiddle.net

Код:

$(document).ready(function() {
    var autocompOpts = {
        minChars:0,
        matchSubset:false,
        matchContains: true,
        source : []
    };

    var domains = [
        "@gmail.com",
        "@yahoo-inc.com",
        "@yahoo.com",
        "@yahoo.co.in",
        "@rediff.com",
        "@rediffmail.com",
        "@hotmail.com",
        "@msn.com"
    ];

    var input = $("#autocomplete");
    input.autocomplete(autocompOpts);

    input.bind('keyup', function(event) {
        if (event.shiftKey == 1 && event.keyCode == 50) {
            var userName = $(this).val();
            userName = userName.substring(0, userName.length - 1);
            var emailIDs = [];
            $.each(domains, function(index,domain){
                emailIDs.push(userName + domain);
            });
            autocompOpts.source = emailIDs;
            $(this).autocomplete(autocompOpts);
        }
    });
});
0 голосов
/ 27 августа 2010

Позвольте мне сначала немного очистить ваш код:

$(document).ready(function()
{
      var autocompOpts = {
          minChars:0,
          matchSubset:false,
          matchContains: true,
          disabled: true,
          source :[
              "@gmail.com",
              "@yahoo-inc.com",
              "@yahoo.com",
              "@yahoo.co.in",
              "@rediff.com",
              "@rediffmail.com",
              "@hotmail.com", 
              "@msn.com"
          ]
      };

      var input = $("#autocomplete");
      input.autocomplete(autocompOpts);

      input.bind('keyup', function(event)
      {
          if(event.shiftKey == 1 && event.keyCode == 50)
          {
              input.autocomplete({disabled: false});
          }
      });
  });

Сделано несколько небольших исправлений и очистка кода, попробуйте.

Кроме того, вы даже включаете библиотеку?

<script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/autocomplete/jquery.autocomplete.js"></script>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...