PHP 양식에서 자동 완성 및 자동 완성을 처리하는 방법

PHP 양식에서 자동 완성 및 자동 완성을 처리하는 방법

인터넷이 발전하면서 사람들은 웹 사이트 작업을 단순화하기 위해 자동 완성 및 자동 완성 기능에 점점 더 의존하고 있습니다. PHP 양식에서 이러한 기능을 구현하는 것은 복잡하지 않습니다. 이 기사에서는 PHP를 사용하여 양식의 자동 채우기 및 자동 완성을 처리하는 방법을 간략하게 소개합니다.

시작하기 전에 자동 완성과 자동 완성이 무엇인지 명확히 해야 합니다. 자동 채우기는 사용자의 이전 입력 또는 기록을 기반으로 양식의 필드를 자동으로 채우는 것을 의미합니다. 예를 들어, 사용자가 이메일 주소를 입력하면 사용자의 이전 입력을 기반으로 가능한 이메일 주소가 자동으로 채워집니다. 자동 완성이란 입력 과정에서 사용자에게 가능한 옵션을 자동으로 제공하는 것을 의미합니다. 예를 들어, 사용자가 도시 이름을 입력하면 사용자가 선택할 수 있도록 가능한 도시 이름이 자동으로 표시됩니다.

먼저 자동 완성 및 자동 완성 데이터를 저장할 데이터베이스가 필요합니다. 도시 이름을 예로 들어 보겠습니다. 먼저 도시 이름을 저장할 "city_name"이라는 필드가 포함된 "city"라는 데이터베이스 테이블을 만듭니다.

CREATE TABLE city (

city_name VARCHAR(255) NOT NULL

);

다음으로 데이터베이스를 채울 도시 이름 데이터를 준비해야 합니다. 데이터를 수동으로 추가하거나 CSV 파일을 사용하여 가져올 수 있습니다.

INSERT INTO city (city_name) VALUES

('北京'),
('上海'),
('广州'),
('深圳'),
('杭州');

이제 데이터베이스와 데이터가 준비되었으므로 양식 처리를 시작할 수 있습니다. 먼저, 사용자 입력을 받기 위한 입력 상자가 필요합니다.

다음을 방지하기 위해 입력 상자의 자동 완성 속성을 "off"로 설정한다는 점에 유의해야 합니다. 브라우저의 기본 자동 완성 기능이 자동 완성 기능을 방해합니다.

다음으로 AJAX를 사용하여 자동 채우기 및 자동 완성 기능을 구현합니다. 입력 상자에 텍스트를 입력한 후 AJAX를 통해 일치하는 도시 이름을 가져와 드롭다운 목록에 표시합니다.

<script><br>$(문서).ready(함수( ){</p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class='brush:php;toolbar:false;'>$('#city').keyup(function(){ var query = $(this).val(); if(query != ''){ $.ajax({ url:&quot;fetch.php&quot;, method:&quot;POST&quot;, data:{query:query}, success:function(data){ $('#cityList').fadeIn(); $('#cityList').html(data); } }); } }); $(document).on('click', 'li', function(){ $('#city').val($(this).text()); $('#cityList').fadeOut(); });</pre><div class="contentsignin">로그인 후 복사</div></div><p>});<br></script>

위 코드에서는 AJAX 사용을 단순화하기 위해 jQuery 라이브러리를 사용했습니다. 사용자가 텍스트를 입력한 후 AJAX를 통해 처리할 수 있도록 입력된 텍스트를 "fetch.php" 파일로 보내고 반환된 도시 이름을 드롭다운 목록에 표시합니다. 사용자가 도시 이름을 클릭하면 입력 상자에 도시 이름을 입력하고 드롭다운 목록을 숨깁니다.

그럼 "fetch.php" 파일은 요청을 어떻게 처리하나요? 다음으로 "fetch.php" 파일에 대한 코드를 작성해 보겠습니다.

//데이터베이스에 연결
$dsn = "mysql:host=localhost;dbname=test;charset=utf8";
$username = "root";
$password = "";
$ options = array(

PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION,
PDO::ATTR_DEFAULT_FETCH_MODE => PDO::FETCH_ASSOC

);
try{

$db = new PDO($dsn, $username, $password, $options);

}catch(PDOException $e){

die("连接数据库失败：" . $e->getMessage());

}

// AJAX 요청의 매개변수 가져오기
$query = $_POST['query'] ? ? '';//데이터베이스에서 일치하는 도시 이름을 쿼리합니다.

$sql = "SELECT * FROM city WHERE city_name LIKE";

$stmt = $db->prepare($sql);
$stmt ->bindValue( ':query', '%'.$query.'%');
$stmt->execute();
$result = $stmt->fetchAll();

// 반환 도시 이름 목록에

if ($stmt->rowCount() > 0){

foreach($result as $row){
    echo "<li>". $row['city_name'] . "</li>";
}

}else{

echo "<li>无匹配城市</li>";

}

?>

위 코드에서는 먼저 데이터베이스에 연결합니다. 그런 다음 AJAX 요청의 매개변수를 가져오고 LIKE 문을 사용하여 데이터베이스에서 일치하는 도시 이름을 쿼리합니다. 마지막으로 쿼리 결과를 프런트 엔드에 반환합니다.

이제 PHP 양식의 자동 채우기 및 자동 완성 기능 구현이 완료되었습니다. 사용자는 도시 이름의 일부만 입력하면 일치하는 도시 이름이 자동으로 얻어져 드롭다운 목록에 표시됩니다. 사용자가 도시 이름을 선택하면 입력 상자에 자동으로 채워집니다. 이러한 방식으로 우리는 편리한 입력 방법을 제공할 뿐만 아니라 사용자 경험도 향상시킵니다.

결론적으로, PHP는 양식의 자동 완성 및 자동 완성을 처리하는 강력한 기능을 제공합니다. 합리적인 데이터베이스 설계와 프런트 엔드 기술을 통해 이러한 기능을 쉽게 구현하고 사용자에게 더 나은 대화형 경험을 제공할 수 있습니다. 이 기사가 PHP 양식의 자동 완성 및 자동 완성을 이해하고 사용하는 데 도움이 되었기를 바랍니다.

위 내용은 PHP 양식에서 자동 완성 및 자동 완성을 처리하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!