2013-10-12 4 views
0

Мне нужно, чтобы стрелять один раз, но это похоже только на стрельбу!onkeyup функция только стрельба один раз

Когда я ввожу что-то в поле ввода, он ищет, но всякий раз, когда я символ назад и искать что-то еще, то ДИВО пребывание того же ..

Вот мой код:

<script type="text/javascript"> 
function suggest1() { 
    var dam_text = document.getElementById('dam').value; 

    if (window.XMLHttpRequest) { 
     xmlhttp = new XMLHttpRequest(); 
    } else { 
     xmlhttp = new ActiveXObject('MicrosoftXMLHTTP'); 
    } 
    xmlhttp.onreadystatechange = function() { 
     if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
      document.getElementById('myDiv').innerHTML = xmlhttp.responseText; 
     } 
    } 
    var target = 'dam_search.php?dam_text=' + dam_text; 
    xmlhttp.open('GET', target, true); 
    xmlhttp.send(); 
} 
</script> 

<input type="text" name="dam" id="dam" onkeyup="suggest1();"><br /> 
<div id="myDiv"></div> 

Здесь является dam_search.php

<?php 

//connect to db stuff here 

if (isset($_GET['dam_text'])) { 
    $dam = $_GET['dam_text']; 
    getSuggest($text); 
} 

function getSuggest($text) { 

    $sqlCommand = "SELECT `name` FROM `table1` WHERE `name` LIKE '%$dam_text%'"; 

    $query = mysql_query($sqlCommand); 

    $result_count = mysql_num_rows($query); 

    while ($row = mysql_fetch_assoc($query)) { 
     echo $row['name'].'<br />'; 
    } 

} 
?> 

ТАКЖЕ: Мне интересно, как я могу поставить возвращение имя это он искал в выпадающем меню из поля ввода вместо в DIV, так что, когда Я нажимаю на одно из имен, оно автоматически заполняет поле ввода.

Спасибо!

+0

Когда вы говорите, что он срабатывает только один раз. Что именно вы имеете в виду - он срабатывает только один раз, когда выдается ключ, или он срабатывает только один раз для страницы или, возможно, что-то еще? – enhzflep

+0

Восстанавливается один раз при каждой загрузке браузера. Итак, я набираю «a» и загружает все с «a» в нем, а затем, когда я набираю «b», он не запускается снова. Я должен перезагрузить браузер для его сброса, чтобы он мог снова запустить. –

+0

Хм, это больше, чем немного странно. Обычно я использую библиотеку AjaxRequest (http://ajaxtoolbox.com/request/), так как она обрабатывает несколько параллельных запросов без особых усилий и намного легче, чем jQuery, с которыми я не заинтересован - я думал, что материал ajax может иметь падали, но также объединили функциональный пример из вашего кода. Php немного фанк - я предполагаю, что это не копия, а скорее проблема типа look'n'retype. Я бы поставил результаты в массив, а затем вернул его как JSON. Затем вы можете загружать и использовать элементы в массиве любым способом. – enhzflep

ответ

0

Обнаруженные мою проблему. Запрос был неправильно обработан!

Я имел переменный $ dam_text как LIKE заявления, когда она должна была быть $ дамбы:

<?php 

//connect to db stuff here 

if (isset($_GET['dam_text'])) { 
    $dam = $_GET['dam_text']; 
    getSuggest($text); 
} 

function getSuggest($text) { 

    $sqlCommand = "SELECT `name` FROM `table1` WHERE `name` LIKE '%$dam_text%'"; 

    $query = mysql_query($sqlCommand); 

    $result_count = mysql_num_rows($query); 

    while ($row = mysql_fetch_assoc($query)) { 
     echo $row['name'].'<br />'; 
    } 

} 
?> 

Кроме того, переменные $ дамба не представляется inide функции, поэтому я переместил его из оператор 'if', в функцию:

<?php 

//connect to db stuff here 

if (isset($_GET['dam_text'])) { 
    getSuggest($text); 
} 

function getSuggest($text) { 

    $dam = $_GET['dam_text']; 

    $sqlCommand = "SELECT `name` FROM `table1` WHERE `name` LIKE '%$dam%'"; 

    $query = mysql_query($sqlCommand); 

    $result_count = mysql_num_rows($query); 

    while ($row = mysql_fetch_assoc($query)) { 
     echo $row['name'].'<br />'; 
    } 

} 
?> 

Приведенный выше код работает отлично! Оказывается, в конце концов, это было не onkeyup! Спасибо за вашу помощь!

0

OnKeyUp будет срабатывать только один раз за каждое событие. нажатие 'A' 'B' и 'C' приведет к трем вызовам для предложения1();

Чтобы убедиться, что ваш браузер работает правильно попробовать это

<script type="text/javascript"> 
function suggest1() { 
    document.getElementById('myDiv').innerHTML = document.getElementById('dam').value; 
} 
</script> 
<input type="text" name="dam" id="dam" onkeyup="suggest1();"><br /> 
<div id="myDiv"></div> 

Вы должны увидеть изменение Div для каждого нажатия клавиши, которое происходит на входе.

Для меня существует два неизвестных вопроса, которые непосредственно указывают на вашу актуальную проблему. Ваш PHP не будет выводить ничего для запроса с нулевой записью и будет выводить только 1 элемент, если вы запрашиваете LIKE, только соответствует одной вещи. Я думаю, что ваша проблема кроется в другом месте, а не с onkeyup.

T тест tokeykey в вашей системе/браузер: Попробуйте добавить в свой файл PHP некоторый отладочный заголовок, например echo strlen($text).'<br />';. Вы должны увидеть изменение номера без использования вашего SQL-запроса для каждого нажатия клавиши, который добавляет или удаляет текст (включая ключ возврата).

Ваш код выглядит хорошо. И прекрасно работает для меня, используя общественный HTTP GET эхо службы на http://ivanzuzak.info/urlecho/

Перестановка ваш PHP для эхо-сервис работает отлично (с небольшим опозданием типизации)

<script type="text/javascript"> 
function suggest1() { 
    var dam_text = document.getElementById('dam').value; 

    if (window.XMLHttpRequest) { 
     xmlhttp = new XMLHttpRequest(); 
    } else { 
     xmlhttp = new ActiveXObject('MicrosoftXMLHTTP'); 
    } 
    xmlhttp.onreadystatechange = function() { 
     if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
      document.getElementById('myDiv').innerHTML = xmlhttp.responseText; 
     } 
    } 
    var target = 'http://urlecho.appspot.com/echo?body=' + dam_text; 
    xmlhttp.open('GET', target, true); 
    xmlhttp.send(); 
} 
</script> 

<input type="text" name="dam" id="dam" onkeyup="suggest1();"><br /> 
<div id="myDiv"></div> 
0

Все еще не уверены в своем вопросе при нажатии на клавиатуру только один раз на загрузку страницы. Это очень сложно рассуждать разумно, не видя больше кода. Тем не менее, вот пример, который я просто бросил вместе, как вы можете представить возвращенные данные более полезным способом.

Код требует, чтобы вы загрузили библиотеку AjaxRequest, о которой я упомянул в предыдущем комментарии. (http://ajaxtoolbox.com/request/)

Здесь я демонстрирую несколько принципов.

  1. Организация данных в PHP класс
  2. построив массив экземпляров этого класса
  3. возвращающихся этот массив в JSON
  4. захватывающего текст JSON и превратить его обратно в объект в JS
  5. Обработка данных

Я привел 2 очень простой пример: первый просто загружает все имена файлов в текущем каталоге (это hol ds jsonDir.php) в элемент выбора. Выбор имени файла приводит к тому, что он копируется в текстовый ввод рядом с кнопкой.

Во-вторых, только извлекает имена файлов png. Он заманивает их всех в элемент выбора. На этот раз, однако, когда элемент выбран, он используется как src для изображения. В каждом случае имена файлов захватываются только тогда, когда/при нажатии соответствующей кнопки. Там немного избыточного/иначе дерьмового кода, который я мог бы сделать лучше, но после 20 часов бодрствования я готов к постели!

code preview image

Надеется, что это полезно для вас. Любые вопросы, просто спросите. :)

1. jsonDir.php

<?php 
class mFile 
{ 
    public $name, $time, $size; 
} 

if (!isset($_GET['wildcard'])) 
    $wildCard = "*.*"; 
else 
    $wildCard = $_GET['wildcard']; 

foreach (glob($wildCard) as $curFilename) 
{ 
    $curFileObj = new mFile; 
    $curFileObj->name = $curFilename; 
    $curFileObj->time = date("d/m/Y - H:i", filectime($curFilename)); 
    $curFileObj->size = filesize($curFilename); 
    $fileArray[] = $curFileObj; 
} 
printf("%s", json_encode($fileArray)); 
?> 

2. readDir.html

<!DOCTYPE html> 
<html> 
<head> 
<script type='text/javascript' src='script/ajaxRequestCompressed.js'></script> 
<script> 
function byId(e){return document.getElementById(e);} 
function newEl(tag){return document.createElement(tag);} 

function myGetAjaxResponseWithCallback(url, target, callbackFunc) 
{ 
    AjaxRequest.get(
    { 
     'url':url, 
     'onSuccess':function(req){ callbackFunc(req.responseText, target); } 
    } 
); 
} 

function getResults1() 
{ 
    var url = "jsonDir.php"; 
    var target = byId('resultsDiv'); 
    myGetAjaxResponseWithCallback(url, target, jsonDataReceived1); 
} 

function getResults2() 
{ 
    var url = "jsonDir.php?wildcard=*.png"; 
    var target = byId('resultsDiv2'); 
    myGetAjaxResponseWithCallback(url, target, jsonDataReceived2); 
} 

function jsonDataReceived1(responseText, targetContainer) 
{ 
    var resultObject = JSON.parse(responseText); 
    targetContainer.innerHTML = ""; 

    var mStr = "There were " + resultObject.length + " records returned" + "<br>"; 
    var mSel = newEl("select"); 

    mSel.addEventListener('change', doAutofill, false); 

    var i, n = resultObject.length; 
    for (i=0; i<n; i++) 
    { 
     var curRecordOption = new Option(resultObject[i].name, i); 
     mSel.appendChild(curRecordOption); 
    } 
    targetContainer.innerHTML = mStr; 
    targetContainer.appendChild(mSel); 
} 

function jsonDataReceived2(responseText, targetContainer) 
{ 
    var resultObject = JSON.parse(responseText); 
    targetContainer.innerHTML = ""; 

    var mSel = newEl("select"); 
    mSel.addEventListener('change', showSelectedImg, false); 

    var i, n = resultObject.length; 
    for (i=0; i<n; i++) 
    { 
     var curRecordOption = new Option(resultObject[i].name, i); 
     mSel.appendChild(curRecordOption); 
    } 
    targetContainer.innerHTML = ''; 
    targetContainer.appendChild(mSel); 
} 


function doAutofill(e) 
{ 
    var curSelIndex = this.value; 
    var curText = this.options[curSelIndex].label; 
    byId('autofillMe').value = curText; 
} 

function showSelectedImg(e) 
{ 
    byId('previewImg').src = this.options[this.value].label; 
} 

</script> 
<style> 
img 
{ 
    border: solid 2px #333; 
} 
</style> 
</head> 
<body> 
    <button onclick='getResults1()'>Get *.* dir listing</button> <input id='autofillMe'/> 
    <div id='resultsDiv'></div> 
    <hr> 
    <button onclick='getResults2()'>Get *.png dir listing</button> <img id='previewImg' width='100' height='100'/> 
    <div id='resultsDiv2'></div> 
</body> 
</html> 
+0

Спасибо за ваш ответ, но не совсем то, что я искал! Надеюсь, это поможет кому-то другому! –

+0

Нет проблем. Действительно, я понял, что это не решение вашего основного вопроса о событии keyup.Тем не менее, он должен освещать путь к части «ТАКЖЕ» вашего вопроса. Это просто вопрос о том, чтобы пометить метку щелкнутого варианта в тексте, а не второй, не связанный с ним, как это было в первом примере. Ааа! Просто посмотрел на ваше собственное решение проблемы. Eccellente! – enhzflep

Смежные вопросы