Tag: html5

当我使用jQuery选择页面上的任何文本时,我将如何显示对话框?

我有充满文字的网页“让我们说那个页面”。 我不是指“输入元素”,我的意思是任何文字都是用来写的 或者……等标签。 当我选择一些单词时,弹出或迷你窗口或对话框会显示一些选项,比如说,链接到电子邮件所选文本或复制或打印。 就像你在任何浏览器中选择一些文本然后单击右键单击所选文本一样,菜单(集成在你的操作系统窗口中)显示出来。 我想要相同的故事,但我选择后立即显示对话框。 无需点击右键。 我正在阅读“UI / API / 1.8 / Dialog” http://docs.jquery.com/UI/Dialog和“.mouseup()” http://api.jquery.com/mouseup/我也发现了这个好文章http://motyar.info/blog/2010/02/get-user-selected-text-with-jquery-and.html 但仍然无法实现我想要的function。 也许它很容易,我不明白:) 感谢您的意见! 谢谢!

通过html表单旋转tabindex

我有一个PHP生成的表单,用作开票接口。 用户通过按tab在表单中工作。 我需要在表单中旋转Tab键,直到他们完成开票流程。 例如,使用此表单: 我需要将选项卡索引从1移动到7,然后选项卡应将它们移回到字段a。 它需要旋转,当我按下ESC时我需要将光标移动到h。 示例 – TAB键将光标从a-> b-> c-> d-> e-> f-> g-> a-> b – > ……-> g移动 ESC键只需将光标移动到h 我怎么能用HTML或javascript做到这一点?

如何通过前缀获取所有data- *属性

我有这样的标签: Link 当我点击这个链接时,我有这样的function $(‘#ssd’).click(function (event) { var customData; // Code to get all the custom data in format like data-info* }); 请注意,data-info * like属性可以是任意数字,这意味着您可以看到其中一个名为data-info1或其中的名为data-info1,data-info2,data-info3。 我如何做到这一点,我查找了JQuery选择器,类似属性启动选择器[名称^ =“值”]将无法工作,因为这里的变化是名字… 如果我是console.log($(‘#ssd’).data()); 我将获得一个具有我不需要的额外属性的对象, toggle: “popover”, bs.popover: Popover 有什么建议? 这就是我做的: dataFullList = $(this).data(); $.each(dataFullList, function (index, value) { if (index !== “toggle” && index !== “bs.popover”) { item.name = value.split(“:”)[0]; item.number […]

如何在HTML5中以popover显示Google图表

我刚开始使用HTML5和JQuery。 我将在导航栏上的弹出窗口中显示Google柱形图。 我有以下代码,但它没有显示popver中的图表。 有人可以帮我解决这个问题吗? 谢谢。 Elpriser $(“#electricity”) .popover( { placement : ‘top’, html : true, content : ‘Nordpool’ }); google.load(“visualization”, “1”, { packages : [ “corechart” ] }); google.setOnLoadCallback(drawChart); function drawChart() { var data = google.visualization.arrayToDataTable([ [ ‘SE1’, ‘Idag’, ‘Imorgon’ ], [ ‘SE1’, 1170, 460 ], [ ‘SE2’, 1170, 460 ], [ ‘SE3’, 660, 1120 […]

输入类型日期格式和日期选择器问题

我正在使用HTML5元素输入属性,目前只有Chrome,iOS Safari和Opera似乎支持它。 所以我已经为那些不支持它的浏览器创建了一个jQuery UI datepicker后备,但是我遇到了一些问题并且无法找到任何答案。 如果我输入了datepickers所需的日期格式,然后选择一个新的日期,那么还有一个额外的yyyy 我认为yyyy-mm-dd格式是荒谬的,并希望它显示mm / dd / yyyy就像chrome一样,即使值仍然是yyyy-mm-dd。 有没有办法用datepicker或更好的解决方案来做到这一点? 例 JS if (!Modernizr.inputtypes.date) { $(‘input[type=date]’).datepicker({ dateFormat: ‘yyyy-mm-dd’ // HTML 5 }); } HTML 请查看firefox以查看datepicker后备和chrome以查看输入类型日期。

根据JSON Response中的时间戳值对数组进行排序

我在我的json响应中有时间戳值,并且能够正确地解析该值。 每个图像都有自己的时间戳值,我需要在增加的时间戳值中显示它。 这意味着应该首先在我的应用程序中加载最后更新的图像。 时间戳在JSON响应中采用以下格式: Brand1{ “FileName”: “520120427043622011.jpg”, “UpdateTimeStamp”: “Jun 10, 2013 8:31:23 AM” } Brand2{ “FileName”: “Kung_Fu_Fingers.jpg”, “UpdateTimeStamp”: “Jun 5, 2013 6:51:12 AM” } Brand3{ “FileName”: “google_logo1.jpg”, “UpdateTimeStamp”: “Jun 10, 2013 8:31:23 AM” } 任何人都可以指导我使用Javascript或jQuery函数根据时间戳值对上述三个品牌图像项进行排序。 我在分割dat值后使用了sort函数,但它只按字母顺序对月份进行排序。 请帮我找到解决方案。 提前致谢。

使用jQuery创建一个新的html5video对象

如何使用jQuery创建video元素,并将其属性(如control)添加到true( ),添加和删除video源( <source src='http://somesite.com/somevideo.mp4' ),等等? 我想在加载之前设置它的所有选项(如自动播放,真或假等) 我尝试了这个没有成功(它适用于图像,但不适用于video): $( document ).ready(function() { var photo = $(”, { id: ‘photo’, src: ‘http://lorempixel.com/400/200/city/’, alt: ” }); photo.appendTo($(‘#gallery’)); var video = document.createElement(‘video’); alert( video.toSource() ); //For testing video.id = ‘video’; video.source.src = ‘http://video-js.zencoder.com/oceans-clip.mp4’; video.type = ‘video/mp4’; video.control = true; video.appendTo($(‘#gallery’)); }); jsFiddle: https ://jsfiddle.net/9cnaz3ju/1/

hover时自动暂停或播放HTML5video

我正在尝试编写一个包含三个按钮的页面的一部分。 每个按钮都应淡出当前video并开始播放与该按钮相关的video。 该video应播放,直到您点击另一个按钮,此时它会淡出并暂停,新video会淡入并开始播放。 我有fadeIn / fadeOut到位,但我有一些问题挂钩暂停和播放function。 有任何想法吗? 这是我到目前为止的jQuery: $(‘.hover-text div[class^=”slide”]’).hover( function () { if (!$(this).hasClass(‘current’)) { $(‘.slides div’).fadeOut(); }; var class = $(this).attr(‘class’); $(‘.slides div.’ + class).fadeIn(‘slow’); $(‘div[class^=”slide”]’).removeClass(‘current’); $(this).addClass(‘current’); }, function () { } ); 我找到了本教程 ,但我不确定如何将该代码合并到我的中。

基于CSS表格的布局行未扩展100%宽度

我想将基于行的css表的宽度扩展到100%的浏览器宽度,而不会破坏其余内容的布局。 请注意,绿色标题栏即使已设置为100%宽度,也不会延伸全宽。 我的代码可以在这里找到: http : //codepen.io/anon/pen/HfnFv CSS html,body{ overflow:visible; height:100%;padding:0;margin:0; } .header{background:green;position:absolute;} .table{ display:table; width:100%; position:relative; min-height:100%; } .trow{ display:table-row; width:100%; } .left{ width:30%; height:100%; background-color:#990000; color:#efefef; display:table-cell; } .left p{ margin:100px 0; } .right{ width:70%; height:100%; background-color:blue; color:#efefef; display:table-cell; } HTML test test test UPDATE 添加 position:absolute; 到标题行。 但是我希望看到一个不能绝对定位子元素的替代解决方案。

单击HTML后如何保持选择?

我正在编写WYSIWYG编辑器(不能使用类似TinyMCE的东西 – 必须自己编写代码),我希望用户能够通过在HTML中添加标签将文本设置为粗体,下划线,链接等。 我遇到的问题是,当用户选择可编辑div中的文本然后单击“粗体”按钮时,它无法找到选择,因为已经取消选择该选择,因为发生了单击事件。 我怎么能阻止这个? 有一个更好的方法吗?