代码之家 › 专栏 › 技术社区 › Haru

HTML文档的字符编码未声明。。。但事实确实如此

utf-8 encoding html

Haru · 技术社区 · 7 年前

我一直得到下面的错误,我不知道为什么。我已经申报了UTF-8!

未声明HTML文档的字符编码。这个在某些浏览器配置中,文档将以乱码文本呈现如果文档包含US-ASCII范围之外的字符。页面的字符编码必须在文档中声明,或在传输协议中。

这是我的头部

<!DOCTYPE html>
<html ng-app lang="en">
<head>
<meta charset="utf-8"/>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"></script>
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
    <link rel="stylesheet" href="css/style.css">
    <title>CUalify - Let them know they qualify for membership</title>
</head>

我尝试了几种不同的编码方式,但我一直遇到同样的问题,页面呈现为空白。

下面是整个索引页的范围。该网站是合格的。组织。

<!doctype html>
<html ng-app lang="en">
 <head>
    <meta charset="utf-8"/>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"></script>
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
    <link rel="stylesheet" href="css/style.css">
    <title>CUalify - Let them know they qualify for membership</title>
 </head>
<body>
<div class="header">
    <div class="wrapper">
    <img class="logo" src="images/logo.png"/>
    </div>
</div>
<main>
<div class="wrapper">
<p>Do visitors to your credit union website know if they qualify for membership without having to search and find the requirements?</p>
<b>Simplify!</b>
<p>We created a one click qualification based on the current location of the user. A user simply clicks one button on your credit union site and is alerted whether or not they qualify for membership based on their location within a county or township.</p>
<b>Our Method</b>
<p>We employ multiple methods of geolocation to track the most reliable location of the user. If the user lands outside of the membership area they are prompted to enter their city to double check whether they qualify.</p>
<b>Pro Credit Union</b>
<p>If a member does not qualify for your credit union they are given options of nearby credit unions in which they maybe eligible for membership. We don't want to lose them to a bank so we present other credit union options.</p>

<p id="demo"></p>
</div>
</main>
<div class="wrapper">
<h2>How it Works</h2>
<p>The first button a user will see will be the main <b>check by my current location</b> button. One click is all it takes to confirm if a user qualifies for the area.</p>
<img class="examples" src="images/blue.png"/><br/><br/>
<p>If the user does not qualify based on their location, we give them a chance to enter their city. We also try another method of geolocation and put that in the search field.</p>
<img style="width:600px;" src="images/yellow.png"/><br/><br/>
<p>If the user still falls outside the area to qualify for membership they see a last error message and shows them a list of credit unions nearby they may qualify for.</p>
<img style="width:600px;" src="images/red.png"/><br/><br/>
<p>If at anytime during the process the user qualifies based on their location, they will be shown this message.</p>
<img style="width:600px;" src="images/green.png"/><br/>

<hr/>

<h2>Create Your Script</h2>
<p>Fill in the information below and copy and paste the code anywhere in your website. Multiple entries can be seperated with a comma and no space.</p>

<div class="section">
    <label for="country">
        Country Code - <a href="https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2#Officially_assigned_code_elements"><b>Find Your Code</b></a>
    </label>
  <input class="creator" type="text" name="country" ng-model="country" maxlength="2" placeholder="US (Optional Filter)"/>
</div>

<div class="section">
    <label for="aa">
        State Code - <a href="https://en.wikipedia.org/wiki/List_of_U.S._state_abbreviations#ANSI_standard_INCITS_38:2009"><b>Find Your Code</b></a>
    </label>
  <input class="creator" type="text" name="aa" ng-model="aa" maxlength="2" placeholder="IL (Optional Filter)"/>
</div>

<div class="section">
    <label for="county">
        Counties
    </label>
  <input class="creator" type="text" name="county" ng-model="county" placeholder="LaSalle County,Grundy County"/>
</div>

<div class="section">
    <label for="township">
        Townships
    </label>
  <input class="creator" type="text" name="township" ng-model="township" placeholder="Bruce Township,Ottawa Township"/>
</div>

<div class="section">
    <label for="city">
        Cities
    </label>
  <input class="creator" type="text" name="city" ng-model="city" placeholder="Streator,Peru,Chicago"/>
</div>

<div class="section">
    <label for="phone">
        Credit Union Phone Number
    </label>
  <input class="creator" type="text" name="phone" ng-model="phone" placeholder="800-555-5555"/>
</div>

<textarea class="copyarea">
<iframe src="https://cualify.org/a.html?aa={{aa}}&country={{country}}&county={{county}}&township={{township}}&city={{city}}&phone={{phone}}" width="100%" height="100%" scrolling="no" seamless="seamless" frameborder="0" style="border:0" />

</textarea>
<br/>
<hr/>
<h2>Dig Deeper</h2>
<p>This is an example of how the script can be imported into your website with an iframe.
You can put your option tags on the end of the url. Iframe should be fully responsive to resizing and browser windows. The following inputs are supported.</p>

<div class="center">
<div class="area">
    <img src="images/state.png"/>
    <b>State / Country</b>
</div>

<div class="area">
    <img src="images/county.png"/>
    <b>County</b>
</div>

<div class="area">
    <img src="images/township.png"/>
    <b>Township</b>
</div>

<div class="area">
    <img src="images/city.png"/>
    <b>City</b>
</div>

<div class="area">
    <img src="images/phone.png"/>
    <b>Phone</b>
</div>
</div>
<br/>
<p>
<b>Parameters: aa</b><br/>

Name: admistrative area<br/>

Type: filter<br/>

Value: state ie 'IL' (Optional field)<br/>

<br/>
<b>Parameters: country</b><br/>

Name: country<br/>

Type: filter<br/>

Value: country ie 'US' (Optional field)<br/>

<br/>
<b>Parameters: county</b><br/>

Name: county<br/>

Value: county name ie 'LaSalle County' (Must match format '[county name] County')<br/>
<br/>
<b>Parameters: township</b><br/>

Name: township<br/>

Value: township name ie 'South Ottawa Township' (Must match format '[township name] Township')<br/>
<br/>
<b>Parameters: city</b><br/>

Name: city<br/>

Value: full city name (Must match format '[city name]')<br/>
<br/>
<b>Parameters: phone</b><br/>

Name: phone number<br/>

Value: any value is allowed<br/>

Notes: The credit union's phone number</br>
<br/>
<h2>Examples:</h2>

<b>One County</b>
<pre>https://cualify.org/a.html?aa=IL&county=Livingston County&phone=815-555-1000</pre><br/>

<b>Multiple Counties</b>
<pre>https://cualify.org/a.html?aa=IL&county=Livingston County,LaSalle County&phone=815-555-1000</pre><br/>

<b>One Township</b>
<pre>https://cualify.org/a.html?aa=IL&township=Bruce Township&phone=815-555-1000</pre><br/>

<b>Multiple Townships</b>
<pre>https://cualify.org/a.html?aa=IL&township=Bruce Township,South Ottawa Township&phone=815-555-1000</pre><br/>

<b>One City</b>
<pre>https://cualify.org/a.html?aa=IL&city=Streator&phone=815-555-1000</pre><br/>

<b>Multiple Cities</b>
<pre>https://cualify.org/a.html?aa=IL&city=Pontiac,Streator&phone=815-555-1000</pre><br/>


<h2>Completed Example</h2>
<p>Below is the code that you would import into your website.</p>
<textarea class="copyarea">&lt;iframe src="https://cualify.org/a.html?aa=IL&county=Some%20County&phone=1234" width="100%" height="100%"frameborder="0" style="border:0" /&gt;</textarea>

<iframe src="https://cualify.org/a.html?aa=IL&country=US&county=Livingston County&township=&city=&phone=" width="100%" height="500px" scrolling="no" seamless="seamless" frameborder="0" style="border:0"></iframe>


<footer>
<p>&copy; 2016 Streator Onized Credit Union</p><br/>
<a href="https://creativecommons.org/licenses/by-nc-nd/4.0/"><img src="images/ccbyncnd.jpg"/></a>
<br/>
</footer>
</div>
</body>
</html>

3 回复 | 直到 7 年前

theberbie 7 年前

meta标记放置正确,因此应该可以工作。我知道这很小,但在更改后您是否有可能保存并刷新正确的页面?

您使用的是哪种浏览器?

user9112752 user9112752 7 年前

如果您使用的是HTML4,那么应该使用

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

你的页面不应该是空白的。错误必须在其他地方。编码只是说明如何呈现字符。

Haru 7 年前

我能够解决这个问题,尽管我不知道为什么它会起作用。我将所有扩展名都更改为。php发件人。html,尽管我在网站上根本没有任何PHP代码。我正在使用jQuery。。。这毫无意义。

更新-此问题是由我在Apache上运行的mod\u pagespeed引起的。我一关掉它,HTML文件就呈现得很好。

它必须与这些指令之一有关。但我还没有时间去测试它。真头痛。

ModPagespeedEnableFilters prioritize_critical_css
ModPagespeedEnableFilters resize_mobile_images
ModPagespeedEnableFilters inline_preview_images
ModPagespeedEnableFilters inline_google_font_css
ModPagespeedEnableFilters extend_cache