JQM (jQueryMobile) 动态删除元素

发布于 2024-10-25 09:46:24 字数 1037 浏览 3 评论 0原文

这是此问题的第 2 部分（好吧，也许是第 3 部分）

这是一个工作示例： http://jsfiddle.net/UcrD8/63/ 这是一个早期的尝试，您可以在选择第一个选项时看到它的工作原理： http://jsfiddle.net /UcrD8/4/ 但是使用 JQM 时，它使用它作为选项的标签，并且它是不可选择的。

添加新选择选项的功能正在工作，但如果我想删除选定的选项，则这不起作用。

更新：

我确实注意到 select 元素被删除，但 jQM 添加的语法仍在显示：

<div class="ui-select">
    <div data-theme="c" class="ui-btn ui-btn-icon-right ui-btn-corner-all ui-shadow ui-btn-down-c ui-btn-up-c">
        <span class="ui-btn-inner ui-btn-corner-all">
            <span class="ui-btn-text">Remove Selected Option</span>
            <span class="ui-icon ui-icon-arrow-d ui-icon-shadow">
            </span>
        </span>
    </div>
</div>

也需要删除它

原文

This is part 2 of this question (ok maybe part 3)

Here is a working example: http://jsfiddle.net/UcrD8/63/
Here is a earlier attempt and as you can see this works when selecting the first option: http://jsfiddle.net/UcrD8/4/
But using JQM it uses this as a label for the options and it is not selectable

The functionality to add a new select option is working but if I wanted to remove a selected option, this is not working.

UPDATE:

I did notice that the select element is being removed but jQM's added syntax is still displaying:

<div class="ui-select">
    <div data-theme="c" class="ui-btn ui-btn-icon-right ui-btn-corner-all ui-shadow ui-btn-down-c ui-btn-up-c">
        <span class="ui-btn-inner ui-btn-corner-all">
            <span class="ui-btn-text">Remove Selected Option</span>
            <span class="ui-icon ui-icon-arrow-d ui-icon-shadow">
            </span>
        </span>
    </div>
</div>

Need to remove this as well

分享到QQ

分享到微博

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

发布评论

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

秋心╮凉 2024-11-01 09:46:24

好吧，由于 jQM 已更新多次，我能够正常工作

http://jsfiddle.net/6fFLb/ 7/

回复收藏 0 原文

可遇━不可求 2024-11-01 09:46:24

我见过很多动态作品的问题。

例如，如果我在页面加载后通过 $.mobile.changePage() 创建页面元素，这些元素应该是 jquery-mobile-ified （数据角色等），它们不会成为 jquery-mobile-ified 并且在任何地方都找不到“再次解析我的页面，jquery”方法。我已经向 jquery mobile 团队记录了一个这样的错误，但我们会看看他们何时解决这个问题。可能就我自己做吧。

回复收藏 0 原文

り繁华旳梦境 2024-11-01 09:46:24

当我必须删除/隐藏某个项目时，我通常将该项目包装在 div 中，然后隐藏该 div。但我不知道在这种情况下这会有多大帮助。

回复收藏 0 原文

往昔成烟 2024-11-01 09:46:24

<!DOCTYPE html> 
<html> 
<head> 
  <meta name=viewport content="user-scalable=no,width=device-width" />
  <link rel=stylesheet href=jquery.mobile/jquery.mobile.css />
  <script src=jquery.js></script>
  <script src=jquery.mobile/jquery.mobile.js></script>
</head> 

<body> 

<div data-role=page id=home>
  <div data-role=header>
    <h1>Home</h1>
  </div>

  <div data-role=content>
    <p> Window content </p>  
    <ul data-role=listview data-inset=true>
      <li data-icon=delete> <a href=#>Element 1 </a></li>
      <li data-icon=delete> <a href=#>Element 2 </a></li>
      <li data-icon=delete> <a href=#>Element 3 </a></li>
      <li data-icon=delete> <a href=#>Element 4 </a></li>
      <li data-icon=delete> <a href=#>Element 5 </a></li>
    </ul>
  </div>
</div>

</body>
</html>

<script>

$("li .ui-icon").bind ("click", function (event)
{
  $(this).closest ("li").remove ();
});

</script>

<!DOCTYPE html> 
<html> 
<head> 
  <meta name=viewport content="user-scalable=no,width=device-width" />
  <link rel=stylesheet href=jquery.mobile/jquery.mobile.css />
  <script src=jquery.js></script>
  <script src=jquery.mobile/jquery.mobile.js></script>
</head> 

<body> 

<div data-role=page id=home>
  <div data-role=header>
    <h1>Home</h1>
  </div>

  <div data-role=content>
    <p> Window content </p>  
    <ul data-role=listview data-inset=true>
      <li data-icon=delete> <a href=#>Element 1 </a></li>
      <li data-icon=delete> <a href=#>Element 2 </a></li>
      <li data-icon=delete> <a href=#>Element 3 </a></li>
      <li data-icon=delete> <a href=#>Element 4 </a></li>
      <li data-icon=delete> <a href=#>Element 5 </a></li>
    </ul>
  </div>
</div>

</body>
</html>

<script>

$("li .ui-icon").bind ("click", function (event)
{
  $(this).closest ("li").remove ();
});

</script>

回复收藏 0 原文

~没有更多了~