Изменить источник изображения кнопки изображения с помощью jquery 1.4.4 - PullRequest
Новая
       2

Изменить источник изображения кнопки изображения с помощью jquery 1.4.4

0 голосов
/ 11 мая 2011

Я попытался изменить src изображения ImageButton , используя jQuery, но фон не изменился.

Я пробовал ниже сценарий или что: 

$(document).ready(function () 
 {
    $('#<%=imageButtonId.ClientID%>').click(function () 
    {

            $('#<%=imageButtonId.ClientID%>').attr("src", "mobile/images/writelogbook_icon.png");

     });
});

Я также пробовал object.css ("backgroundImage", "path"); Но это также не удается. Пожалуйста, предложите мне. Я использую JQuery 1,4,4 мин

Edit: Relavent код из HTML: 

<input type="image" name="imageButtonId" id="imageButtonId" src="Images/admin.png" />



   $('#imageButtonId).click(function () {
$(this).attr('background-image', 'Images/customer.png');        });

Спасибо

Нареш Горадара

Ответы [ 4 ]

1 голос
/ 11 мая 2011

Вы должны попробовать это: 

<asp:ImageButton ID="imageButtonId" runat="server" src="Images/admin.png"> 
</asp:ImageButton>
<script type="text/javascript">
    $(document).ready(function () {
        $('#<%=imageButtonId.ClientID%>').click(function (e) {

            $('#<%=imageButtonId.ClientID%>').attr("src", "Images/customer.png");
            e.preventDefault();
        });
    });
</script>

Это отлично работает в моем тестовом проекте.Просто запомните e.preventDefault, а также передайте e в функции щелчка.Это приводит к тому, что кнопка Image не отправляет обратно на сервер, следовательно, обновляя страницу.

Если страница обновляется, кнопка image снова будет иметь свое исходное изображение.

1 голос
/ 11 мая 2011

Какой тип html является # imageButtonId.ClientID?Src используется с изображениями, а не с кнопками (на тот случай, если вы пытаетесь сделать это с помощью кнопки).Если это кнопка, вы должны использовать css ('background-image', path).Обратите внимание на фоновое изображение - НЕ camelCase.

Если это все еще не работает, проверьте CSS объекта в таком инструменте разработчика, как firebug, инструменты разработчика safari / chrome и т. Д. Изменяется ли свойство, просто не отображаетсяизображение или ничего не устанавливается.

И, как было сказано ранее, вы хотите использовать $ (this) .css ('background-image', path);

Удачи!

Редактировать: только что заметил добавление html - почему бы просто не сделать: 

$('#imageButtonID').click(function() {
   $(this).css('background-image', 'path/to/image');
});

Кроме того, если вам не требуется функциональность типа карты изображений type = image, я бы рекомендовал использовать стилизованную кнопкувместо.Вы бы просто сделали это с помощью CSS (встроенный как style = 'background-image: path / to / image.png' или в таблице стилей. Например: 

<input name='imageButtonID' id='imageButtonID' style='background-image:path/to/image.png'>

Затем 

$('#imageButtonID').click(function() {
   $(this).css('background-image', 'path/to/newimage.png');
});
1 голос
/ 11 мая 2011

Сложно сказать по вашему вопросу.Несколько вещей, чтобы попробовать:

  1. Посмотрите на ваш источник HTML на сгенерированной странице.Что такое <%=imageButtonId.ClientID%> отображается как?
  2. Alert $('#<%=imageButtonId.ClientID%>').length.Что вы получаете?
  3. Лично у меня не будет второго $('#<%=imageButtonId.ClientID%>').Вместо этого используйте $(this).

Вы можете попробовать опубликовать часть отрендеренной страницы (например, HTML с imageButtonId и отрендеренный JavaScript. Это поможет нам определить, что не так.

0 голосов
/ 11 мая 2011

Вы используете относительный путь.Правильный ли путь к вашему изображению?Попробуйте использовать абсолютный путь.

...