php는 텍스트 상자에 이미지를 동적으로 생성합니다

거기에 입력 된 텍스트에 텍스트 상자 옆에 이미지 나 이미지 세트를 표시하고 싶습니다. 예.php는 텍스트 상자에 이미지를 동적으로 생성합니다

<script> 
$(document).ready(function(){ 
//do something here??? 
}); 
</script> 
</head> 

<body> 
<?php 
     $q=$_GET['q']; 
     $my_data=mysql_real_escape_string($q); 

     $host = 'localhost'; 
     $db = 'mydb'; 
     $user = 'username'; 
     $pass = ''; 

     mysql_connect($host, $user, $pass); 
     mysql_select_db($db); 
     $NameImage = mysql_query("SELECT `name` from `mydb`.`mytable` where `description` LIKE '%$my_data%' ORDER BY `name` "); 
     $rowName = mysql_fetch_array($NameImage); 


?> 
    <label>Tag:</label> 
    <input name="tag" type="text" id="tag" size="20"/> <img src = "myimagepath/<?php echo $rowName[0] ?>.jpg" height="140">   
</body> 
</html>

을하지만 어려움은 내가 제출하지 않고 텍스트 상자에 (때 사용자 입력을) 텍스트 값을 얻는 방법을 몰라 :

If type "cat" it displays image "cat.jpg" or type "ca" it displays "car.jpg" and "cat.jpg"

나는 이것을 시도하고있다. 이미지를 동적으로 채우는 방법은 무엇입니까?

출처

2014-09-17 user1314404

이 쓰기 :

<input type="text" name="tag" id="tag" list="sometag" onchange="alert(this.value);" /> 
<datalist id="sometag"> 
    <select onchange="$('#tag').val(this.value)"> 
    <?php 
     //select option list from data base 
    ?> 
    </select> 
</datalist>

참조 참조 :

<script src="js/jquerymin.js"></script> 
<script> 
function getImage(value) 
{ 
    $.ajax({ 
       url: 'getImage.php', 
       type: "POST", 
       data: { 
        'value' : value, 
       }, 
       beforeSend : function() {     
       }, 
       success : function(response) { 

         $('.main-content').html(response); 
       }, 
       error : function() {             
       }, 
       complete : function() { 
       } 

      }); 
} 
</script> 
<body> 
<label>Tag:</label> 
     <input name="tag" type="text" id="tag" size="20" onkeyup="getImage(this.value);"/>  

     <div class="main-content"></div> 
</body> 
</html>

당신의 getImage.php

<?php 

     $host = 'localhost'; 
     $db = 'mydb'; 
     $user = 'username'; 
     $pass = ''; 

     mysql_connect($host, $user, $pass); 
     mysql_select_db($db); 

     $val = $_POST['value']; 
     $sql_img="SELECT `name` from `mydb`.`mytable` where `description` LIKE '%$val%' ORDER BY `name`"; 
     $result=mysql_query($sql_img, $con); 

     while($row=mysql_fetch_array($result)) 
     { 
      echo "<img src='myimagepath/".$row[name]."'/>"; 
      echo "<br>"; 
     } 

    ?>

HTML5에서 자동 제안에 대한 기능을 제공합니다 : http://devproconnections.com/html5/working-html5-web-forms-autocompletion-and-datalist-element

중요한 것은 입력 상자의 onchange 이벤트는 입력에서 포커스가 나가고 텍스트가 변경된 경우에만 발생합니다. 멋지지 않아.

출처

2014-09-17 04:37:27 herr

완벽한 답변! 고맙습니다. 천재! – user1314404

한 가지주의 할 점 : mysql을 사용하여 질문에 답변을 게시하기 만하면됩니다. 그러나 mysql을 사용하면 안된다. mysqli 또는 PDO를 사용하는 대신. – herr

그 이유는 무엇입니까? Btw, 내 응용 프로그램에서 실제로 사용자가 입력 할 때 제안을 사용할 수 있습니다, 그래서 그들은 "onkeyup"대신 "onchange"같은 것을 사용할 수 있도록 제안 텍스트를 선택하려면 클릭 할 수 있습니까? – user1314404

이미지의 원본으로 일부 스크립트가 필요합니다. 그런 다음 GET 매개 변수로 인쇄 할 텍스트를 건너 뛸 때 JavaScript를 통해 이미지 원본을이 스크립트로 변경하기 만하면됩니다. 당신의 first.php 파일에서

출처

2014-09-17 04:01:30

예를 들려 줄 수 있습니까? – user1314404

Sry 나는 당신의 질문 권리를 얻지 못했다고 생각합니다. 이미 존재하고 파일 이름이 데이터베이스에있는 이미지를 표시하려고합니까? 당신은 단지 제안과 같은 것을 원하거나 입력 필드 밖의 텍스트로 이미지를 만들고 싶습니까? –

php는 텍스트 상자에 이미지를 동적으로 생성합니다

답변

관련 문제