Хотите, чтобы jQuery по умолчанию переключался на "показ" при обновлении страницы

Question

Получил странный здесь,

Я использую CMS сделано просто и в основном у меня есть корзина. По умолчанию он скрыт до тех пор, пока кто-нибудь не нажмет на опцию "просмотреть мою корзину", и корзина будет вставлена ​​с помощью переключателя jQuery.

Это на самом деле работает нормально.

Проблема возникает при обновлении корзины. Поскольку это структура формы, вы должны внести свои изменения (в кол-во или проверить элемент для удаления), а затем нажать "обновить корзину". Страница обновляется, и корзина снова скрывается.

Можно ли как-нибудь сделать так, чтобы при нажатии на эту ссылку (в частности) страница обновлялась, а корзина показывалась по умолчанию?

Вот мой код, я думаю, что я мог бы прикрепить "класс" к ссылке, может быть, но я не уверен.

<script type="text/javascript" charset="utf-8">
  (function($) {
$('#show_basket').click(function() {
  $('#basket_box').toggle('slow');
  }); 

$('#lclose_basket').click(function() {
    $('#basket_box').hide('slow');
    }); 


$('#continue_shop').click(function() {
    $('#basket_box').hide('slow');
    }); 
$('#continue_shop2').click(function() {
    $('#basket_box').hide('slow');
    }); 
  }(jQuery));

NB: есть две ссылки каждая, так как у меня есть мобильная и настольная версия корзины.

ТАКЖЕ:

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

Answer 1

Для отображения корзины по умолчанию, после обновления вы можете сделать что-то вроде этого:

$(document).ready(function(){  
    $('#basket_box').show('slow'); 
}

Если вы не хотите запускать это при каждом обновлении сайта, вы можете, например, добавить GET-параметр в вашу ссылку и проверить этот параметр:

function getParameterByName(name) {
    name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
    var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
        results = regex.exec(location.search);
    return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}
var param = getParameterByName('parameter-name');
if(param){
    //do stuff
}

Примечание: функцию для извлечения параметра по его имени можно найти здесь

Вторая возможность может быть, показывая корзину onlick по ссылке и обновляя содержимое корзины через AJAX.

$('#refresh_link').click(function() {
  $('#basket_box').show('slow');
  //do ajaxcall -> write callback-data to the cart
   $.ajax({
    url: "pathto/cart.php", /path to your script
    type: "POST",
    data: 'id='+id, // e.g. the ID of the cart or the customer
    success: function (data) {
         //data contains the data you get from "cart.php"
         //you can s.th. like:
         $('div').html(data); // this write the data into a specified div.
    }
    });
  }); 

Для получения дополнительной информации о jQuery и Ajax попробуйте прочитать руководство ( http://api.jquery.com/jquery.ajax/) или посмотреть здесь: http://www.php4every1.com/tutorials/jquery-ajax-tutorial/

В jQuery вы можете использовать большинство CSS-селекторов. Таким образом, вы можете вызвать события клика, которые вы показали в своем вопросе, когда вы нажимаете, например, на div, где отображается корзина:

$('div.cart').click(function(){
    $('#basket_box').hide('slow');
});

Надеюсь, у меня все получилось, и это помогло вам.

Привет