天天看点

社区设计细节 : 用户可选是否在新窗口中打开主题 社区设计细节 : 用户可选是否在新窗口中打开主题

一般的,很多社区在列表页里浏览具体主题的时候,基于各种考虑.默认要么全部打开新窗口,要么不打开新窗口,用户根本没有选择的余地,今天发现一个论坛,提供了一个复选按钮CheckBox,让用户自己决定是否打开新窗口浏览主题. 在这点上做的不错,赞一下,顺便也要把人家的技术给"偷"过来.其实比较简单了.关键是人家的设计思想有可借鉴之出,为了完整.把代码部分也弄出来:

社区设计细节 : 用户可选是否在新窗口中打开主题 社区设计细节 : 用户可选是否在新窗口中打开主题

function switchTopicOpenMode(box)

社区设计细节 : 用户可选是否在新窗口中打开主题 社区设计细节 : 用户可选是否在新窗口中打开主题
社区设计细节 : 用户可选是否在新窗口中打开主题 社区设计细节 : 用户可选是否在新窗口中打开主题
社区设计细节 : 用户可选是否在新窗口中打开主题 社区设计细节 : 用户可选是否在新窗口中打开主题

{

社区设计细节 : 用户可选是否在新窗口中打开主题 社区设计细节 : 用户可选是否在新窗口中打开主题

    var isPopNew   = box.checked;

社区设计细节 : 用户可选是否在新窗口中打开主题 社区设计细节 : 用户可选是否在新窗口中打开主题

    var anchorTags = document.getElementsByTagName('a');

社区设计细节 : 用户可选是否在新窗口中打开主题 社区设计细节 : 用户可选是否在新窗口中打开主题

    for (var i=0; i<anchorTags.length; i++)

社区设计细节 : 用户可选是否在新窗口中打开主题 社区设计细节 : 用户可选是否在新窗口中打开主题
社区设计细节 : 用户可选是否在新窗口中打开主题 社区设计细节 : 用户可选是否在新窗口中打开主题
社区设计细节 : 用户可选是否在新窗口中打开主题 社区设计细节 : 用户可选是否在新窗口中打开主题
社区设计细节 : 用户可选是否在新窗口中打开主题 社区设计细节 : 用户可选是否在新窗口中打开主题

        if (anchorTags[i].getAttribute('name') != 'topiclink') continue;

社区设计细节 : 用户可选是否在新窗口中打开主题 社区设计细节 : 用户可选是否在新窗口中打开主题

        anchorTags[i].target = isPopNew ? '_blank' : '_self';

社区设计细节 : 用户可选是否在新窗口中打开主题 社区设计细节 : 用户可选是否在新窗口中打开主题

    }

社区设计细节 : 用户可选是否在新窗口中打开主题 社区设计细节 : 用户可选是否在新窗口中打开主题

}

然后放个CheckBox:

<input type='checkbox' onclick='javascript:switchTopicOpenMode(this)' id='keyofpopwin' />在新窗口中打开主题

另外.需要为列表的每个链接加上name=topiclink

(请您对文章做出评价)

继续阅读