jQuery UI 按钮切换

发布于 2024-08-20 16:54:53 字数 1029 浏览 3 评论 0原文

我正在尝试从 POST 操作的回调中切换 UI 按钮。 jquery UI 按钮需要将“ui-icon ui-icon-minus”或“ui-icon ui-icon-checked”作为

我尝试切换的 span.class - 但切换仅删除并添加回一部分班级 - 它不会交换整个班级。这就是我现在陷入困境的地方：

$('#toggle-page, a.toggle-page').click(function() {
pageID = $(this).parent('div').attr('id');
$.post(
    "webadmin/pages.toggle.serialize.php", 
    {id : pageID },
    function(data, textStatus, xhr) {
      if ($("#"+pageID+" a#toggle-page span").hasClass('ui-icon ui-icon-minus')) {
            $("#"+pageID+" a#toggle-page span").removeClass('ui-icon ui-icon-minus');
            $("#"+pageID+" a#toggle-page span").addClass('ui-icon ui-icon-check');
          }
      if ($("#"+pageID+" a#toggle-page span").hasClass('ui-icon ui-icon-check')) {
            $("#"+pageID+" a#toggle-page span").removeClass('ui-icon ui-icon-check');
            $("#"+pageID+" a#toggle-page span").addClass('ui-icon ui-icon-minus');
          }
    }
);
});

我知道上面的代码不是正确的方法......但是有人可以指出我正确的方向吗？ Id 等有点嵌套，因为有多个条目可以编辑 - 因此是 pageID 的内容。

原文

I'm trying to toggle a UI Button from a callback of a POST operation. The jquery UI Button would either need to have "ui-icon ui-icon-minus" or "ui-icon ui-icon-checked" as a span.class

I tried to toggle - but toggle only removes and adds back a part of the class - it doesn't exchange the whole class. This is where I'm stuck at right now:

$('#toggle-page, a.toggle-page').click(function() {
pageID = $(this).parent('div').attr('id');
$.post(
    "webadmin/pages.toggle.serialize.php", 
    {id : pageID },
    function(data, textStatus, xhr) {
      if ($("#"+pageID+" a#toggle-page span").hasClass('ui-icon ui-icon-minus')) {
            $("#"+pageID+" a#toggle-page span").removeClass('ui-icon ui-icon-minus');
            $("#"+pageID+" a#toggle-page span").addClass('ui-icon ui-icon-check');
          }
      if ($("#"+pageID+" a#toggle-page span").hasClass('ui-icon ui-icon-check')) {
            $("#"+pageID+" a#toggle-page span").removeClass('ui-icon ui-icon-check');
            $("#"+pageID+" a#toggle-page span").addClass('ui-icon ui-icon-minus');
          }
    }
);
});

I know the code above is not the right way... but can someone point me in the right direction?
The Id etc. are a bit nested because theres multiple entries that can be edited - hence the pageID stuff.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

往日 2024-08-27 16:54:53

我会这样做：

$('#toggle-page, a.toggle-page').click(function() {
pageID = $(this).parent('div').attr('id');
$.post(
    "webadmin/pages.toggle.serialize.php", 
    {id : pageID },
    function(data, textStatus, xhr) {
      var node = $("#"+pageID+" a#toggle-page span");
      node.toggleClass('ui-icon-minus');
      node.toggleClass('ui-icon-check');
    }
);
});

I would do it like this:

$('#toggle-page, a.toggle-page').click(function() {
pageID = $(this).parent('div').attr('id');
$.post(
    "webadmin/pages.toggle.serialize.php", 
    {id : pageID },
    function(data, textStatus, xhr) {
      var node = $("#"+pageID+" a#toggle-page span");
      node.toggleClass('ui-icon-minus');
      node.toggleClass('ui-icon-check');
    }
);
});

回复收藏 0 原文

心头的小情儿 2024-08-27 16:54:53

这应该更接近你想要的。如果您打算再次使用 jQuery 选择器，请始终缓存它的返回值：

$('#toggle-page, a.toggle-page').click(function() {
  var  $page = $(this).parent('div'),
      pageID = $page.attr('id');
  $.post(
      "webadmin/pages.toggle.serialize.php", 
      {id : pageID },
      function(data, textStatus, xhr) {
        var $span = $page.find('a#toggle-page span');
        if($span.hasClass('ui-icon-minus')) {
          $span.removeClass('ui-icon-minus').addClass('ui-icon-check')
        } else {
          $span.removeClass('ui-icon-check').addClass('ui-icon-minus')
        }
      }
  );
});

This should be closer to what you want. Always cache the return from a jQuery selector if you plan to use it again:

$('#toggle-page, a.toggle-page').click(function() {
  var  $page = $(this).parent('div'),
      pageID = $page.attr('id');
  $.post(
      "webadmin/pages.toggle.serialize.php", 
      {id : pageID },
      function(data, textStatus, xhr) {
        var $span = $page.find('a#toggle-page span');
        if($span.hasClass('ui-icon-minus')) {
          $span.removeClass('ui-icon-minus').addClass('ui-icon-check')
        } else {
          $span.removeClass('ui-icon-check').addClass('ui-icon-minus')
        }
      }
  );
});

回复收藏 0 原文

~没有更多了~