2010-09-02 1 views
0

Я извлекаю некоторые значения из БД и сохраняю их в файле. У меня есть список с идентификатором в каждом элементе li.добавить определенную строку из файла в элемент списка с помощью jquery

Когда я нажимаю элемент, я хочу добавить строку из файла, равную id, на который я только что нажал.

У меня есть пример:

<li id="test1">just test </li> 

Там есть значение test1 в строке в файле. Я хочу добавить его значение, когда я нажимаю на него.

$(document).ready(function() { 


      $.get("serverResource", function(data){ 
         $('#test1').click(function() { 
            $('#test1').append(data); 
        }); 

Проблема заключается в том, что data содержит все данные файла, а не только строки. Как я могу получить строку из файла, а затем проверить значение с идентификатором, и если это правда, добавьте его?

+0

ли вам есть пример того, как выглядит строка в файле? И как выглядят данные, которые возвращаются? –

+0

данные в файле - это только текст и строка1: test1, line2: test2 и т. Д. Итак, когда я нажимаю элемент test li, я хочу, чтобы рядом с текстом «просто тест» добавлялся текст «test1». То, как я это делаю, когда я нажимаю на элемент li, у меня есть все данные файла, добавленные рядом с текстом «just test» ... Мне нужно smthing, чтобы взять каждую строку из файла и сравнить ее с id, поэтому, когда он верен для печати только строки ... – mt0s

ответ

0

если данные теста выглядит следующим образом:

test1 
test2 
test3 
test4 

и линия X correspondens Ли X, то вы можете прочитать содержимое файла при загрузке с помощью AJAX в яваскрипта массив путем разбиения строки, а затем вставки данных следующим образом:

<html> 
     <head> 
      ... 
      <script type="text/javascript"> 
       $(document).ready(function() {         
        $.get('my_data.txt', function(data) { 
         var lines = data.split("\n"); 

         $('#root li').click(function() { 
          var li = $(this); 
          // find position of the li in the containing ul 
          // and append the line to the li 
          var index = $('#root li').index(li); 
          li.append(lines[index]); 
         }); 
        });       
       }); 
      </script> 
     </head> 
     <body> 
      <ul id="root"> 
       <li id="test1">Content 1</li> 
       <li id="test2">Content 2</li> 
       <li id="test3">Content 3</li> 
       <li id="test4">Content 4</li> 
      </ul> 
     </body> 
    </html> 

Это только хороший подход, если ваш файл данных не содержит сотни больших и длинных линий. Читая, что многие данные в массиве javascript потребляют много памяти.

Если у вас есть много данных, вы должны использовать логику стороны сервера извлечения строки из файла:

  <script type="text/javascript"> 
       $(document).ready(function() {         
        $('#root li').click(function() { 
         var li = $(this); 
         var index = $('#root li').index(li); 

         // use this ajax request to let PHP fetch the content of that line 
         $.get('fetchline.php', 'index=' + index, function(line) { 
          li.append(line);      
         }); 
        });      
       }); 
      </script> 

И fetchline.php может выглядеть следующим образом (упрощенно):

<?php 
// get the index provided as GET var 
$index = intval($_GET['index']); 
// read all lines from the data file in an array, not super optimisied, 
// but should do for not too large files 
$lines = file('my_data.txt'); 
// print the line with index = $index 
print $lines[$index]; 

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

  • Нет связанных вопросов^_^