Можете ли вы запросить/получить переменные из img src?

Это вопрос из двух частей, но я хочу убедиться, что первая действительно достижима.

Во-первых, можете ли вы получить переменные доступа, установленные img src? Я пытаюсь использовать jQuery, включая MySQL UPDATE и т. д., но мне нужно было убедиться, что это сработает?

<a href="#" class="chnge"><img src="filename.jpg?id=1&open=1" /></a>

Тогда jQuery будет иметь что-то похожее на:

      $("img#chnge").click(function() {

        var id      = $('#id').attr('value');
        var open    = $('#open').attr('value');
            $.ajax({
                type: "POST",
                url: "update.php",
                data: "id="+ id +"& open="+ open,
                success: function(){
                    $('img#chnge').fadeTo('slow',0.4);

                }
            });
        return false;
        });

Я надеюсь, что это очевидно, в принципе, у меня есть изображение, если для него «открыто» установлено значение 1, когда вы щелкаете по нему, изменяется непрозрачность, но оно также отправляет запрос на мой update.php.

Я знаю, где ошибки в этой форме, я просто не знаю, как их исправить. #1 = переменные в img src (я не знаю, могу ли я вместо этого поместить их в href?), а 2-й - это $('#id') и $('#open'). Я не думаю, что они правильно, но я не знаю, на что их изменить.

Любая помощь будет высоко оценена.

Филипп.

ОБНОВЛЕНИЕ: прочитав ответ Отара, я подумал, что лучше добавить полный код: как изображения должны быть там, где они есть...

Спасибо. Поскольку эти изображения генерируются с помощью цикла for() (php), повлияет ли это на то, как будет работать этот код?

<?php
$query = mysql_query("SELECT * FROM catalogue");
$num = mysql_num_rows($query);

for ($x=1;$x<=$num;$x++) {

  $row = mysql_fetch_row($query);

  ?>

  <a href="#" id="chngeHref" /><img src="<?php echo $row[2]; ?>?id=<?php echo $row[0]; ?>&open=<?php echo $row[1]; ?>" id="chnge" /></a>

<?php

  /* row[0] = id 
     row[1] = open (1 or 0)
     row[2] = image url
  */

  }

?>

person Phillip L    schedule 21.08.2010    source источник


Ответы (2)


В любом случае ваше изображение должно быть PHP-скриптом...

Передайте ему GET-параметры, сделайте в скрипте все, что хотите, а затем выведите изображение следующим образом:

Допустим, файл называется image.php

<?php

    $par = $_GET['test'];

    // Do some PHP related job here


    // Load the image
    header('Content-Type: image/jpeg');
    header('Location: /path/to/your/image.jpg');

?>

Затем используйте его так: <img src="image.php?test=value">

Сначала он вызовет PHP-скрипт, а затем отобразит изображение.

person Otar    schedule 21.08.2010
comment
Спасибо, это позволило мне добавить переменные к изображению. Я ценю вашу помощь. - person Phillip L; 22.08.2010
comment
что, если вам нужно 10 изображений из файла PHP? (какие изменения вы должны применить к скрипту PHP и JQuery, чтобы иметь возможность получить 10 изображений из файла php?) - person Shadi; 26.11.2011
comment
@Shadi Передайте URL-адрес изображения в качестве параметра скрипта <img src="image.php?img=/path/to/your/image.jpg&test=value"> и измените заголовок перенаправления следующим образом: header('Location: ' . $_GET['img']);. Пожалуйста, убедитесь, что вы проверяете/защищаете/экранируете переданный параметр... - person Otar; 27.11.2011
comment
Спасибо, но при использовании этого решения снова «image.php» отправляет только одно изображение в html-файл. Мне нужен php для отправки более одного. что-то вроде: header('Расположение: /path/to/your/image1.jpg'); header('Расположение: /path/to/your/image2.jpg'); header('Расположение: /path/to/your/image3.jpg'); а затем в html: ‹img src=image.php, image1› ‹img src=image.php, image2› ‹img src=image.php, image3› - person Shadi; 27.11.2011
comment
@Shadi Как вы представляете себе отображение нескольких изображений в одном теге <img>? Это далеко от возможностей HTML... Зачем вам нужно использовать что-то подобное? - person Otar; 28.11.2011
comment
Нет, мне нужны разные изображения в разных тегах изображений. например, я хочу получить 3 изображения с сервера и отобразить их в 3 разных местах на моей странице. (положение картинок на странице будет задано клиентским кодом, а изображения будут создаваться сервером). Спасибо. - person Shadi; 28.11.2011
comment
@Shadi Тогда метод, который я вам сказал, идеально соответствует вашим потребностям. <img src="image.php?img=image1.jpg"> <img src="image.php?img=image2.jpg"> <img src="image.php?img=image3.jpg"> - person Otar; 28.11.2011

Извините, я не совсем понимаю, что вы пытаетесь сделать, но думаю, что это может помочь. Вы можете сохранить «открытое» состояние изображения как переменную внутри $(function(){..}). Затем вы сможете получить и установить значение этой переменной из события клика.

$(function() {

    var open = false; // store the image state in the closure not global
    var id = .. 

    $(".chnge img").click(function() {
        if (!open) {
            // fade-in, post to server or whatever

            $.ajax({
                type: "POST",
                url: "update.php",
                data: "id="+ id +"& open="+ open,
                success: function(){
                    // handle response here.
                    // you can still access the open variable here!
                }
            }

            open = true; // want to update open?
        } 
    });
});
person tarn    schedule 21.08.2010
comment
Я недостаточно понимаю язык, чтобы знать, сработает ли это... ха-ха. Или как это реализовать. Спасибо за ваш вклад! :D - person Phillip L; 24.08.2010
comment
не могли бы вы объяснить свой ответ немного больше? например, каково содержимое php-файла и успеха: функция ()? Заранее спасибо. - person Shadi; 27.11.2011