Скрыть / закрыть кнопку с помощью jquery

#javascript #jquery #javascript-events

#javascript #jquery #jquery-события

Вопрос:

Я создал поле div, которое должно быть удалено одним щелчком мыши. Там будет маленькое изображение «X», и когда вы нажимаете на него, поле исчезает. Не должно быть возможности показать его снова. В идеале я хотел бы каким-то образом сохранить информацию в файле cookie, чтобы она не отображалась при обновлении страницы или при просмотре других страниц (это было бы реализовано по всему сайту).

Вот мой простой пример кода:

http://jsfiddle.net/2gNrC/

Ответ №1:

Вот решение, которое использует localStorage — я оставляю его в качестве упражнения для читателя, чтобы переключиться на использование файлов cookie:

http://jsfiddle.net/aTKs5/7/

1. Спасибо, это отлично работает в JSfiddle! Я постараюсь реализовать это вживую и дам вам знать.

2. Это не работает, когда он подключен к Сети. Я правильно ее обернул? Сценарий в голове следующий код: <script type=»text/javascript»> $(‘#closebutton’).click(function(){$(‘#box’).hide();if (localStorage) {localStorage.boxHidden = ‘Y’;}}); $(document). готово(функция(){if (localStorage amp;amp; localStorage.boxHidden amp;amp; localStorage.boxHidden == ‘Y’){$(‘#box’).hide();}}); </script>

3. Я обновил скрипку, чтобы обернуть все $(document).ready() так, как я должен был сделать с самого начала — извините!

Ответ №2:

Быстро и грязно: (http://jsfiddle.net/bambitlaw/RsS5V /)

 $(document).ready(function(){
$('#closebutton').click(function(){
    $('#box').hide();
    $(this).hide();
    document.cookie="hideit=yes";
});    
var i,x,y,ARRcookies=document.cookie.split(";");
for (i=0;i<ARRcookies.length;i  )
{
  x=ARRcookies[i].substr(0,ARRcookies[i].indexOf("="));
  y=ARRcookies[i].substr(ARRcookies[i].indexOf("=") 1);
  x=x.replace(/^s |s $/g,"");
    if (x=="hideit")
   {
    $('#box').hide();
    $('#closebutton').hide();
    }
  }

});

Ответ №3:

Я полагаю, вы говорите о диалоговом окне jquery. Я обычно использую «X» в качестве самого символа, и это выглядит хорошо. Пример выглядит следующим образом.

     $('#yourdiv').dialog({
        closeOnEscape: true,
        draggable: true,
        modal: true,
        closeText: 'X',
        width: 500,
        title: 'Your Title',
        buttons: [
                    {
                        text: "Save",
                        click: function () {
                            $(this).dialog("close");
                        }
                    },
                    {
                        text: "Cancel",
                        click: function () {
                            $(this).dialog("close");
                        }
                    }

                ]
    });