动态添加到网格行

如何解决动态添加到网格行

我试图修改网格布局,以便如果用户单击一个网格行,则另一个网格行会附加到所选网格行上,并显示有关所选网格的其他信息。使用jQuery mobile可以吗?
    <div class=\"ui-grid-a\">
        <div class=\"ui-block-a\"><div class=\"ui-bar ui-bar-b\" style=\"height:20px\">A</div>    
    </div>
    

解决方法

它的功能尚不完善,但我希望这能给您一个启发,例如Live Example:http://jsfiddle.net/F6Zdp/44/ HTML:
<div data-role=\"page\" id=\"gridplus\"> 
    <div data-role=\"content\">
        <div class=\"ui-grid-a\" id=\"currentgrid\"> 
            <div class=\"ui-block-a\"><div class=\"ui-bar ui-bar-e\" style=\"height:50px\">I\'m a Block and text inside will wrap.</div></div>
            <div class=\"ui-block-b\"><div class=\"ui-bar ui-bar-e\" style=\"height:50px\">I\'m a Block and text inside will wrap.</div></div> 
        </div>
        <br />
        <input type=\"button\" id=\"addcolumn\" name=\"addcolumn\" value=\"Add Column\"/>
        <input type=\"button\" id=\"removecolumn\" name=\"removecolumn\" value=\"Remove Column\"/>
    </div>
</div>
JS:
var currentGrid = $(\'#currentgrid\');
var previousGrid;

$(\'#addcolumn\').click(function() {
    grid = currentGrid.attr(\'class\');
    previousGrid = grid;
    nextGrid = grid.substring(0,grid.length-1)+String.fromCharCode(grid.charCodeAt(grid.length-1)+1);

    $(\'#currentgrid\').removeClass(grid).addClass(nextGrid);
    $(\"#currentgrid\").children().each(function() {
        c = $(this);
        block = c.attr(\'class\');
        nextBlock = block.substring(0,block.length-1)+String.fromCharCode(block.charCodeAt(block.length-1)+1);

        if($(\'.\'+nextBlock).length) {
            doNothing = true;
        } else {
            c.after(\'<div class=\"\'+nextBlock+\'\"><div class=\"ui-bar ui-bar-e\" style=\"height:50px\">I\\\'m a Block and text inside will wrap.</div></div>\');
        }
    });
});

$(\'#removecolumn\').click(function() {
    grid = currentGrid.attr(\'class\');
    $(\'#currentgrid\').removeClass(grid).addClass(previousGrid);
    $(\"#currentgrid\").children().last().remove();
}).page();
    ,使用可折叠的内容-http://jquerymobile.com/demos/1.0a4.1/docs/content/content-collapsible.html 我认为内容可以是jQuery网格。     

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


Selenium Web驱动程序和Java。元素在(x,y)点处不可单击。其他元素将获得点击?
Python-如何使用点“。” 访问字典成员?
Java 字符串是不可变的。到底是什么意思?
Java中的“ final”关键字如何工作?(我仍然可以修改对象。)
“loop:”在Java代码中。这是什么,为什么要编译?
java.lang.ClassNotFoundException:sun.jdbc.odbc.JdbcOdbcDriver发生异常。为什么?
这是用Java进行XML解析的最佳库。
Java的PriorityQueue的内置迭代器不会以任何特定顺序遍历数据结构。为什么?
如何在Java中聆听按键时移动图像。
Java“Program to an interface”。这是什么意思?
Java在半透明框架/面板/组件上重新绘画。
Java“ Class.forName()”和“ Class.forName()。newInstance()”之间有什么区别?
在此环境中不提供编译器。也许是在JRE而不是JDK上运行?
Java用相同的方法在一个类中实现两个接口。哪种接口方法被覆盖?
Java 什么是Runtime.getRuntime()。totalMemory()和freeMemory()?
java.library.path中的java.lang.UnsatisfiedLinkError否*****。dll
JavaFX“位置是必需的。” 即使在同一包装中
Java 导入两个具有相同名称的类。怎么处理?
Java 是否应该在HttpServletResponse.getOutputStream()/。getWriter()上调用.close()?
Java RegEx元字符(。)和普通点?