希腊字母不会显示在我的网页浏览器页面

时间:2018-05-14 18:30:39

标签: javascript html eclipse

我在 Eclipse html表单中编写了以下代码段,其中包含希腊字符中的标题和标题。 我的问题是虽然我已经设置了 UTF-8编码,但我的网页浏览器页面中无法正确显示这些字符。相反,它们显示为问号(????)。

我的代码段:

var product = $scope.product = [];															// Custom JavaScript creates a JavaScript Object and binds it to the current AngularJS $scope of the form as a variable named "product".															                                                        
		$scope.addProduct = function () {													// We make a function named "addProduct".
			var product = {};																// We add a new "product" to the Array.
			product.Category = $scope.Category;
			product.Description = $scope.Description;
			if (!!$scope.camForm.fields[0].element[0].files[0]) {
				product.Details = $scope.camForm.fields[0].element[0].files[0].name;		// We check whether a file is uploaded.
			} else {
					return;																	// If no file is uploaded, it returns "undefined".
			}
			product.Price = $scope.Price;
			$scope.product.push(product);													// We use the value of the "product" input field to add a new "product" to the Array.
			$scope.Category = "";															// We clear the TextBox "���������".
			$scope.Description = "";														// We clear the TextBox "���������".
			$scope.Details = "";															// We clear the TextBox "������������".
			$scope.Price = "";																// We clear the TextBox "����".
		};
		$scope.removeProduct = function (index) {											// We make a function named "removeProduct". 					
			var category = $scope.product[index].Category;									// We find product's Category using "index" from the Array and binds it to the current AngularJS $scope of the form as a variable named "category".
			$scope.product.splice(index, 1);												// We use an index to remove a "product" from the Array.
		}
		$scope.isAddFormValid = function () {												// We make a function named "isAddFormValid".
			return ($scope.Category &&
					$scope.Description &&
					$scope.camForm.fields[0].element[0].files[0] &&
					$scope.Price) ? true : false;											// If all of the 4 parameters of variable "product" are added, the value will be "true", otherwise the value will be "false".
		}
		camForm.on('form-loaded', function() {												// We hook into the lifecycle of Camunda SDK JS Form.
			camForm.variableManager.createVariable ({										// We "create" (declare) a new process variable  
					name:'product',															// named 'product' and
					type:'json',															// provide as type information 'json' used for serialization.
					value:product
			});
		});
		camForm.on('submit', function(evt) {												// We hook into the lifecycle of Camunda SDK JS Form.
			if (product.length<1) {															// If no "product" is added,
				evt.submitPrevented = true;													// an event handler prevents the form from being submitted by setting the property "submitPrevented" to 'true'.
			}
		});
<!DOCTYPE html>
<html lang="en">
	<head>																																
		<meta charset="UTF-8">																											
		<meta name="viewport" content="width=device-width, initial-scale=1.0">															
		<meta http-equiv="X-UA-Compatible" content="ie=edge">																			
		<title>Document</title> 																										
	</head>
	<body>
		<form role="form" name="insertForm" accept-charset="utf-8">
			<h2><b>����� ���������</b></h2>																								<!-- We set the heading of the HTML Table. -->
			<div>													
				<table style="width:100%;">																								
					<thead>																												<!-- We group the header content in the HTML Table. -->
						<tr>																											<!-- The header content of the HTML Table is not repeated. -->																											
							<th style="width:140px;">���������</th>
							<th style="width:305px;">���������</th>
							<th style="width:250px;">������������</th>
							<th style="width:75px;" >���� (�)</th>
							<th></th>
						</tr>
					</thead>
					<tbody ng-repeat="x in product track by $index">																	<!-- The HTML Table is populated from the JSON Array "product", using a "ng-repeat" directive which is assigned to each row of the Table in order to repeat all the objects of the Array. -->
						<tr>																											<!-- Each row of the HTML Table consists of 4 HTML Input Form fields and 1 button. -->													
							<td><input style="width:140px;" type="text" value="{{x.Category}}" /></td>						
							<td><input style="width:305px;" type="text" value="{{x.Description}}" /></td>
							<td><input style="width:250px;" type="text" value="{{x.Details}}" /></td>	
							<td><input style="width:75px;"  type="number" value="{{x.Price}}" /></td>
							<td><input type="button" ng-click="removeProduct($index)" value="Remove" /></td>							<!-- The "ng-click" directive is assigned to the "Remove" button and calls the function named "removeProduct" with the current "$index" when this button is clicked. -->
						</tr>
					</tbody>
				</table>
			</div>
			<hr>																														<!-- We separate the HTML content. -->
			<div>
				<h2><b>���������� ��� ������</b></h2>																						<!-- We set the heading of the HTML Form. -->
				<div class="row">																										<!-- We set the "1st row" of the HTML Form. -->	
					<div class="col-md-6">																								<!-- We use "md" for "medium" screen devices of width equal to or greater than 992px and "6" for adding 6 columns. -->															
						<div class="form-group">																						<!-- We use "form-group" for optimum spacing. -->
							<label class="control-label" for="category">���������</label>
							<div class="controls">
								<input style="width:140px;" id="category" type="text" ng-model="Category" />							<!-- The "ng-model" directive binds the value of the "���������" input field to the created variable "Category" in AngularJS. -->
							</div>
						</div>
					</div>
					<div class="col-md-6">																								
						<div class="form-group">
							<label class="control-label" for="Description">���������</label>
							<div class="controls">
								<input style="width:305px;" id="Description" type="text" ng-model="Description" />						<!-- The "ng-model" directive binds the value of the "���������" input field to the created variable "Description" in AngularJS. -->	
							</div>
						</div>
					</div>
				</div>
				<div class="row">																										<!-- We set the "2nd row" of the HTML Form. -->
					<div class="col-md-6">
						<div class="form-group">
							<label class="control-label" for="Details">������������</label>
							<div class="controls">
								<input style="width:250px;"
							   		   id="Details"
							   		   type="file"
							   		   cam-variable-name="Details"
							           cam-variable-type="File"
							           cam-max-filesize="10000000" ng-model="Details" />												<!-- The "ng-model" directive binds the value of the "������������" input field to the created variable "Details" in AngularJS. -->
							</div>
						</div>
					</div>
					<div class="col-md-6">
						<div class="form-group">
							<label class="control-label" for="price">���� (�)</label>
							<div class="controls">
								<input style="width:75px;" id="price" type="number" ng-model="Price" />									<!-- The "ng-model" directive binds the value of the "���� (�)" input field to the created variable "Price" in AngularJS. -->
							</div>
						</div>
					</div>
				</div>
				<div class="row">																										<!-- We set the "3rd row" of the HTML Form. -->
					<div class="col-md-4">																								<!-- We use "md" for medium screen devices of width equal to or greater than 992px and "4" for adding 4 columns. -->
						<div class="controls">
							<input type="button" ng-click="addProduct()" ng-show="isAddFormValid()" value="Add" />						<!-- The "ng-show" directive shows the input element ("Add" button) only if the "isAddFormValid()" expression (function) returns "true". The "ng-click" directive is assigned to the "Add" button and calls the function named "addProduct()" when this button is clicked. -->
						</div>
					</div>
				</div>
			</div>
			<script src="insert-products-and-specifications.js" charset="utf-8" cam-script type="text/form-script"></script>			<!-- We call the external script file ("insert-products-and-specifications.js"). -->
		</form>
	</body>
</html>

有人对此有任何想法吗? 谢谢, 史蒂夫

3 个答案:

答案 0 :(得分:0)

试试这个:

<!doctype html>
<html lang="el">
  <head>

    <meta charset="utf-8">

    <title>Hello, world!</title>
  </head>
  <body>
        <form role="form" name="startForm" accept-charset="utf-8">
            <h2>Ώρα για προμήθειες</h2>
        </form>
  </body>
</html>

答案 1 :(得分:0)

以下作品:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
</head>
<body>

  <form role="form" name="startForm" accept-charset="utf-8">
    <h2>Ώρα για προμήθειες</h2>
</form>

</body>
</html>

答案 2 :(得分:0)

我设法解决了我的问题。 我没有修改代码中的内容。 解决方案是在我的eclipse编辑器中更改一些常规设置。 对于在eclipse中可能遇到相同编码问题的人,我写了以下步骤:

检查并修改日食中的以下偏好。

文本编辑器的编码应为UTF-8。 - 一般 - &gt;编辑 - &gt;文字编辑 - &gt;拼写 - &gt;编码 - &gt;默认UTF-8 HTML文件的编码应为UTF-8。为此,您可以配置为使用工作区编码。 - 网络 - &gt; HTML文件 - &gt;使用工作区编码 工作区的编码应为UTF-8。 - 一般 - &gt;工作区 - &gt;文本文件编码 - &gt;其他 - &gt; UTF-8 您还应该检查资源的编码。为此,请在eclipse项目上单击鼠标右键,然后选择“属性”。在新打开的窗口中,单击“资源”并检查“文本文件编码”的值