Tag: html

IOS设备问题与HTML表单input（type = text）: 所以我有一个HTMLlogin表单有两个字段：电子邮件和密码。除IOS设备（iPhone，iPad）外，这些设备的浏览器都可以轻松填充。在IOS领域几乎没有焦点，一旦焦点，键盘popup，我开始打字，但实际上没有填写。我已经尝试在Chrome和Safari浏览器，仍然得到相同的结果。领域保持黑色。贝娄是我的表格格式： <form method="post" name="login" action="login"> <div class="divInputWrapper "> <i class="icon-envelope inputIcon inlineElt"></i> <label for="email"></label> <input type="text" name="email" placeholder="Enter your email address" class="formInput"/> </div> <div class="divInputWrapper "> <i class="icon-envelope inputIcon inlineElt"></i> <label for="password"></label> <input type="password" name="password" class="formInput"/> </div> <button class="blue centeredContent">Login</button> </form> 我试着添加一个自动对焦属性，预设一个值，但仍然是相同的。

iOS需要双击一个简单的链接元素: 如果您点击iOS上的某个元素，浏览器将触发mouseover/mousemove事件并呈现:hover样式。如果在此过程中检测到“内容更改”，则不会触发点击事件，您必须再次点击才能触发点击事件。这在developer.apple.com上有logging。即使没有应用鼠标事件或:hover样式，我在网页上也遇到了“内容更改”的问题。这花了一段时间，但我能够将网页缩减为一个小的testing用例： <style> a:hover { color: red } foo + * { color: red } </style> <a href="about:blank">foo</a> <input type="search"> 在这个页面上，你必须在“foo”链接点击两次来浏览。 testingiPad mini和iPhone（本机和模拟器）。之后，我发现这个博客文章有类似的问题。但唯一的解决scheme适用于我的问题是下面的CSS： input[type=search]::-webkit-search-cancel-button { display: none; } 但是，如果我想让search取消button可见，则无法使用此解决方法。这个问题还有其他解决方法吗？我前几天在bugreport.apple.com上发布了这个bug，直到现在还没有苹果的反应。这个错误似乎是在iOS 6和7中，如果有一天它会被修复，那将会很好。我如何知道这是一个webkit还是一个iOS的bug？哪里是报告这个错误的正确的地方？ UPDATE 这个错误似乎在iOS 8中得到了修复。testing了iPad mini和iPhone（本机和模拟器）。更新2 Bug在iOS 8中没有完全修复，如果你在大括号之间join了一些CSS，例如color: red ，它仍然会出现。我更新了testing用例，以显示iOS 8中的错误。更新3 这个错误在iOS 9中没有修复，除了“按照预期行事”之外，bugreport.apple.com仍然没有任何反应。

ios 7浏览器套件围绕div元素的黑色边框: 我在iOS7的浏览器中出现了一个奇怪的错误，在div元素周围出现黑线。但是，当你放大一个元素时，这些线条正在消失。有没有人有一个想法是什么导致这个奇怪的错误？在iOS6中没有任何行出现。这是发生在这个url： http ： //www.tristanfrencken.com/ 希望有人能帮助我！

iOS Safari 8input溢出滚动: 我在移动Safari 8.1版本中遇到了一个问题。这似乎是在手机上的所有版本的Safari 8的错误。当你在input文本中input文本时，文本比input本身更长，光标在input时会一直向右移动 – 这是正确的。问题在于，如果您select并尝试向左移动到隐藏的文本，则无法滚动。同样，如果在input外部select，则不能向右滚动以查看隐藏的文本。你唯一的select是全选和删除。任何解决这个问题的方法？我已经上传了不同inputtypes的示例页面，所有这些行为都存在。小提琴： http : //jsfiddle.net/b7kmxaL6/ （访问移动Safari） <form action=""> <fieldset> <input type="text" class="text"> <input type="email" class="email"> <input type="password" class="password"> </fieldset> </form>

alignment到页面底部的button与移动Safari的菜单栏冲突: 我正在build立一个在多个平台上必须function性和漂亮的门户网站。其中一个平台是IOS Safari，这是我遇到的一个问题。在我的代码中，我将两个浮动buttonalignment的宽度和高度为100％这一切工作正常，我的button显示完全像他们应该在页面的底部。但是，当我点击button从移动Safari的紧凑视图切换到全视图，我的button隐藏在底部的导航栏后面！当用户点击屏幕底部的10％时，safari mobile是否正常显示扩展菜单？我怎样才能避免这一点？在这个gif中，你可以在IOS模拟器上看到问题：正如你所看到的问题只发生在一个button在视图的下10％。这只是一个正常的button，我的代码被几个开发人员三重检查，它没有错误。

为什么iOS Safari添加额外的字母间距？: 我想我已经find了谷歌字体在移动（iOS 8）Safari的networking渲染错误。在我看来，Mobile Safari为所有使用Google字体的文本添加了一小部分字母间距，或者使用其他字体。我尝试使用哪个Google字体（Open Sans）并不重要。它在所有现代浏览器上正确渲染。 testing了Android，FF，Chrome，Safari。试着在iOS设备上加载这个页面来看看我的意思。另请参阅代码和屏幕截图。查看此链接以进行实时评论： https ： //dl.dropboxusercontent.com/u/430406/Temp%20%5Bok%20to%20delete%5D/Checking%20Font/index.html <!DOCTYPE html> <html> <head> <title></title> <link href='http://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'> </head> <body> <h2 style="font-family: 'Roboto'">Roboto: Looks like it gets a bit extra line-spacing in iOS Safari, though this is not possible to find in web inspector</h2> <h2 style="font-family: 'Arial'">Arial: Works fine in […]

正则expression式在ios中提取href url并丢弃锚标签的其余部分？: 我想在目标C中编写一个URL提取函数。input文本可以是任何东西，可能包含也可能不包含html定位标记。考虑一下： NSString* input1 = @"This is cool site <a href="https://abc.com/coolstuff"> Have fun exploring </a>"; NSString* input2 = @"This is cool site <a target="_blank" href="https://abc.com/coolstuff"> Must visit </a>"; NSString* input3 = @"This is cool site <a href="https://abc.com/coolstuff" target="_blank" > Try now </a>"; 我想修改string为"This is cool site https://abc.com/coolstuff 忽略锚标记之间的所有文本。而且需要考虑其他属性，如锚点标记中的_target 我可以做类似的事情 static NSRegularExpression *regex = [NSRegularExpression […]

iOS：从NSString（一个htmlstring）剥离<img …>: 所以我有一个NSString ，它基本上是一个包含所有常用html元素的htmlstring。我想要做的具体事情就是从所有的img标签中删除它。 img标签可能有或没有最大宽度，样式或其他属性，所以我不知道它们的长度。他们总是以/>结尾我怎么能这样做？编辑：根据nicolasthenoz的答案，我想出了一个解决scheme，需要较less的代码： NSString *HTMLTagss = @"<img[^>]*>"; //regex to remove img tag NSString *stringWithoutImage = [htmlString stringByReplacingOccurrencesOfRegex:HTMLTagss withString:@""];

iOS上的JavaScript：打开HTMLselect元素: 我不希望，但我会问，以防万一。我希望能够使用JavaScript在iPhone / iPad的移动版Safari中打开select元素。广泛的谷歌/堆栈溢出search显示，很多人希望能够在浏览器中做到这一点，但不支持（为什么不，我想知道？）。已经提出了各种黑客技巧，从select元素调用focus() ，改变size属性来使更多的option元素可见，或者用<div>和<ul>元素构造一个完全模拟的select元素。但是，我会喜欢在iPad和iPhone中使用本地浏览器select控件。我想知道，也许有人可能知道专有的Apple WebKit方法来做到这一点。这将是这样的： var myselect = document.getElementsByTagName("select")[0]; myselect.open(); // this method doesn't exist 作为一个奖励，知道一个布尔属性也是很方便的，它说明select元素当前是否处于打开/活动状态（即不仅仅是元素是否有焦点）。我知道我可以通过跟踪点击和更改事件来解决这个问题，但是一个简单的属性会很有用。妄想？更新：我还没有答案，但是我发现，模拟成功的mousedown在Google Chrome中打开了select元素，但不是iPad或Firefox等等： function simulateMouseEvent(eventName, element) { var evt = document.createEvent("MouseEvents"); evt.initMouseEvent(eventName, true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null); element.dispatchEvent(evt); } simulateMouseEvent("mousedown", select); 更新： […]

将视口设置为缩放以适应宽度和高度: 我正在一个适合特定宽度和高度的网站（885×610 div，1px边框和3px顶部边距）。我希望用户不必滚动或缩放以查看整个div; 它应该始终是完全可见的。由于设备具有各种分辨率和宽高比，所以想到的想法是用JavaScriptdynamic设置“视口”元标记。这样，div将始终是相同的尺寸，不同的设备将不得不以不同的方式进行放大，以便将整个div放在视口中。我尝试了我的想法，并得到了一些奇怪的结果。以下代码适用于首页加载（在Android 4.4.0的Chrome 32.0.1700.99中testing），但在刷新时，缩放级别会发生变化。另外，如果我注释掉alert ，即使在首页加载时也不起作用。小提琴 <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0"> <script type="text/javascript"> function getViewportWidth() { if (window.innerWidth) { return window.innerWidth; } else if (document.body && document.body.offsetWidth) { return document.body.offsetWidth; } else { return 0; } } function getViewportHeight() { if […]