1

我尝试获得类似于我的 jQuery 移动列表视图中附加的图像的布局。我目前在星形图像上使用 .ui-li-icon 类，但即使我用自己的 css 属性覆盖了定位，我也没有将其对齐到右侧。

我当然可以按位置强制星星在右边：绝对；但这会在不同平台上以及横向与纵向模式之间造成问题。

在 jQuery mobile 中获得如下布局的最佳方法是什么？

图片：http ://a4.mzstatic.com/us/r1000/095/Purple/ff/1d/33/mzl.ecpvufek.320x480-75.jpg

4

2 回答 2

2

我重新考虑了我的旧答案并重新做了这个问题，特别是为了适应 mvc 4 框架，但客户端都是一样的。
所以让我们开始吧：
如果你只想要 html，你可以在这里得到它
这个链接是一个 3 部分的复选框列表、复选框、项目的链接和信息弹出窗口：

这是带有复选框和图标的工作列表视图的 jsfiddle 的链接

iv 在最后添加了一些 2 部分列表框和一个部分，如有任何问题，请告诉我。

现在对于控制器，您需要做的就是 

[Authorize]
public ActionResult Items(string act, 
    string tab, string search_by, string search, string sort, string sortdir, int? page, int? resultsPerPage,
    List<int> selected, int? projectId, string username)
{
    if (act == "AddItemsToUser")
    {
        string response;
        if (selected != null)
        {
            response = "Project Items Added:";
            foreach (var item in selected)
            {
                try
                {
                    if (username != null)
                        if (UserItemRecordModel.InsertUserItem(username, item, null, null, 0, null, null))
                            response += item + " - inserted, ";
                }
                catch (Exception ex)
                {
                    response += item + " - " + ex.Message + ", ";
                }
            }
            response.TrimEnd(' ', ',');
        }
        else
        {
            response = "No Items Were Selected!";
        }
        return Json(response, JsonRequestBehavior.AllowGet);
    }
    else if (act == "AddItemsToProject")
    {
        string response;
        if (selected != null)
        {
            response = "Project Items Added:";
            foreach (var item in selected)
            {
                try
                {
                    if (projectId != null)
                        if (ProjectItemRecordModel.InsertProjectItem(projectId.ToString(), item, null, null, 0, null, null))
                            response += item + " - inserted, ";
                }
                catch (Exception ex)
                {
                    response += item + " - " + ex.Message + ", ";
                }
            }
            response.TrimEnd(' ', ',');
        }
        else
        {
            response = "No Items Were Selected!";
        }
        return Json(response, JsonRequestBehavior.AllowGet);
    }
    else if (act == "RemoveItemsFromUser")
    {
        string response;
        if (selected != null)
        {
            response = "Project Items Removed:";
            foreach (var item in selected)
            {
                try
                {
                    if (UserItemRecordModel.DeleteUserItem(username, item))
                        response += item + " - deleted, ";
                }
                catch (Exception ex)
                {
                    response += item + " - " + ex.Message + ", ";
                }
            }
            response.TrimEnd(' ', ',');
        }
        else
        {
            response = "No Items Were Selected!";
        }
        return Json(response, JsonRequestBehavior.AllowGet);
    }
    else if (act == "RemoveItemsFromProject")
    {
        string response;
        if (selected != null)
        {
            response = "Project Items Removed:";
            foreach (var item in selected)
            {
                if (ProjectItemRecordModel.DeleteProjectItem(projectId.ToString(), item))
                    response += item + " - deleted, ";
            }
            response.TrimEnd(' ', ',');
        }
        else
        {
            response = "No Items Were Selected!";
        }
        return Json(response, JsonRequestBehavior.AllowGet);
    }

    List<ItemRecordModel> items = ItemRecordModel.GetSensors(search_by, search, sort, sortdir);
    return View("Items", new AdminRecordsViewModel() { Records = items });
}

这是我的旧答案：
我解决了您的问题，您需要更改一些内容，但是您可以使用复选框完成可搜索的列表视图，如下所示：

jsfiddle 示例：

基本： 基本 jsfiddle 版本

更好的版本： 更好的版本

带有复选框和图标或图像的jQuery移动列表视图

于 2012-12-27T23:44:07.800 回答