マテリアライズオートコンプリートが機能しない

マテリアライズのオートコンプリートをテストしていますが、何らかの理由で動作しません。ここマテリアライズオートコンプリートが機能しない

は私のコードです：

<link type="text/css" rel="stylesheet" href="css/style.css"/> 
<title>Stamboom</title> 
<link rel="stylesheet" href="css/materialize.css"> 
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> 
<script type="text/javascript" src="js/jquery.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.7/js/materialize.min.js"></script> 

     <div class="input-field"> 
        <input class="purple darken-4" id="autocomplete-input" class="autocomplete" type="search"> 
        <label for="autocomplete-input"><i class="material-icons">search</i></label> 
        <i class="material-icons">close</i> 
     </div> 
<script> 
$(document).ready(function(){ 
$('input.autocomplete').autocomplete({ 
    data: { 
    "Apple": null, 
    "Microsoft": null, 
    "Google": 'http://placehold.it/250x250' 
    } 
}); 
}); 
</script>

私は別の形でこれをテストしていると私はこれをしようとすると、それは作業を行い、いくつかの理由：

<div class="row"> 
    <div class="col s12"> 
     <div class="row"> 
     <div class="input-field col s12"> 
      <i class="material-icons prefix">textsms</i> 
      <input type="text" id="autocomplete-input" class="autocomplete"> 
      <label for="autocomplete-input">Autocomplete</label> 
     </div> 
     </div> 
    </div> 
    </div> 
<script> 
    $(document).ready(function(){ 
    $('input.autocomplete').autocomplete({ 
     data: { 
     "Apple": null, 
     "Microsoft": null, 
     "Google": 'http://placehold.it/250x250' 
     } 
    }); 
    }); 
    </script>

、私はいくつかのことを試してみましたが、ためてきました何らかの理由でそれが機能しないだけです。あなたは

<input class="purple darken-4" id="autocomplete-input" class="autocomplete" type="search">

コードの線の上にあなたのコードにマイナーなミスを犯している

出典

2016-08-31 Mixedfruitjuice

あなたが使用してオートコンプリートのための答えを見つけることができますhttp://stackoverflow.com/a/43133503/3295819 – Bharathiraja

ただ一つのクラス属性にすべてのクラスを組み合わせて、2つのクラス属性と2番目のクラス属性が考慮されていないが含まれています。

<input class="purple darken-4 autocomplete" id="autocomplete-input" type="search">

$(document).ready(function(){ 
 
    $('input.autocomplete').autocomplete({ 
 
    data: { 
 
\t "Apple": null, 
 
\t "Microsoft": null, 
 
\t "Google": 'http://placehold.it/250x250' 
 
\t } 
 
    }); 
 
});

<!DOCTYPE html> 
 

 
<html> 
 
<head> 
 
<title>Stamboom</title> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script> 
 
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.7/js/materialize.min.js"></script> 
 
</head> 
 
<body> 
 
    <div class="input-field"> 
 
\t <input class="purple darken-4 autocomplete" id="autocomplete-input" type="search"> 
 
\t <label for="autocomplete-input"><i class="material-icons">search</i></label> 
 
\t <i class="material-icons">close</i> 
 
\t </div> 
 
</body> 
 
</html>

出典

2016-10-13 05:27:11

マテリアライズオートコンプリートが機能しない

答えて

関連する問題