Question

我目前正在开展Phonegap项目。这是一个旅游应用程序。我想显示一些韩国人物。内容保存在index.js内的数据库中，并在我的p_attractiondetails.html中调用。但是，韩文字符无法正确显示。我尝试添加lang属性lang = "ko"和元标记<meta http-equiv="content-type" content="text/html; charset=utf-8" />，但仍无法正确显示字符。有人可以帮帮我吗？这是我的代码。

index.js

// Wait for PhoneGap to load
//
document.addEventListener("deviceready", onDeviceReady, false);

// Populate the database 
//
function populateDB(tx) {
    tx.executeSql('DROP TABLE IF EXISTS ATTRACTIONS');
    tx.executeSql('CREATE TABLE IF NOT EXISTS ATTRACTIONS (id INTEGER NOT NULL PRIMARY KEY AUTOINCREMENT, title TEXT, data TEXT)');
    tx.executeSql('INSERT INTO ATTRACTIONS (id, title, data) VALUES ("1", "La Mesa Dam", "The La Mesa Dam is a dam in Quezon City in the Philippines. It is part of the Angat-Ipo-La Mesa water system, which supplies most of the water supply of Metro Manila. The La Mesa Dam is an earth dam whose reservoir can hold up to 50.5 million cubic meters occupying an area of 27 square kilometers. <br><br> Metro Manila and its surrounding areas are divided into two water concessionaires: Maynilad Water (red) and Manila Water (blue). <br><br> The water collected in the reservoir is treated on-site by the Maynilad Water Services, and at the Balara Treatment Plant further south by the Manila Water. Both water companies are private concessionaires awarded by the Metropolitan Waterworks and Sewerage System, the government agency in charge of water supply.")');
    tx.executeSql('INSERT INTO ATTRACTIONS (id, title, data) VALUES ("2", "La Mesa Ecopark", "La Mesa Ecopark Data")');
}
// Query the database
//
function queryDB(tx) {
tx.executeSql('SELECT * FROM ATTRACTIONS', [], querySuccess, errorCB);
}

// Query the success callback
//
function querySuccess(tx, results) {
    var len = results.rows.length;
    var title;
    var data;
    var i;
   //alert("DEMO table: " + len + " rows found.");
    for (i=0; i<len; i++){
        title = results.rows.item(0).title;
        data = results.rows.item(0).data;
        //alert("Row = " + i + " ID = " + results.rows.item(i).id + " Title = " + results.rows.item(i).title + " \nData =  " + results.rows.item(i).data);
    }

    $(function (){
        $('.title').html(title);
        $('.data').html(data);
    })
}

// Transaction error callback
//
function errorCB(err) {
    alert("Error processing SQL: "+err.code);
}

// Transaction success callback
//
function successCB() {
    var db = window.openDatabase("Database", "1.0", "PhoneGap Demo", 200000);
    db.transaction(queryDB, errorCB);
    //alert("success!");
}

// PhoneGap is ready
//
function onDeviceReady() {
    var db = window.openDatabase("Database", "1.0", "PhoneGap Demo", 200000);
    db.transaction(populateDB, errorCB, successCB);

}

p_attractionsdetails.html

  <!DOCTYPE html>
  <html lang="ko">
  <head>
     <title>QC App</title>
    <!--<meta name="viewport" content="width=device-width, initial-scale=1">-->
    <meta http-equiv="content-type" content="text/html; charset=euc-kr" />
    <meta content="initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">
    <script src="js/jquery-1.8.3.min.js"></script>
    <script src="js/jquery.mobile-1.4.0.min.js"></script>

    <link href="css/jquery.mobile.structure-1.4.0.min.css" rel="stylesheet">
    <link href="css/jquery.mobile.theme-1.4.0.min.css" rel="stylesheet">
    <link href="css/jquery.mobile-1.4.0.min.css" rel="stylesheet">
    <link href="css/photoswipe.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">
    <link href="css/listview-grid.css" rel="stylesheet">
    <script src="js/index.js"></script>
     <script type="text/javascript" src="cordova.js"></script>
    </head>
    <body>

    <div data-role="page" id="LaMesaDam" data-title="LaMesaDam">
        <div data-role="header" data-theme="b" data-position="fixed">
            <h1>Attractions</h1>
            <a href="#left-panel2" data-icon="grid" class="ui-btn-left">Menu</a>
            <a href="#" class="ui-btn ui-shadow ui-corner-all ui-icon-location ui-btn-icon-notext ui-btn-inline"></a>
        </div>

        <div role="main" class="desc_img my-page ui-content jqm-fullwidth">
            <div>
                <img class="imgdisplay" src="images/LaMesaDam.png">
                <p> <img style="width:16px;" src="images/icons/193-location-arrow.png"> 12 km </p>
            </div>
            <div lang="ko" role="main" class="my-page desc_page ui-content jqm-fullwidth">
                <h1 lang="ko" class="title"></h1>
                <h5 lang="ko" class="data"></h5>
                <a href="#nearby" class="ui-btn ui-shadow ui-corner-all ui-btn-icon-right ui-icon-carat-r">Nearby Places</a>
            </div>
        </div>
        <!-- id nav-panel-->
        <div data-role="panel" id="left-panel2" data-theme="b">
            <ul data-role="listview" data-theme="b" data-divider-theme="b" data-inset="false">
                <li data-icon="false"><a href="index.html" rel="external">Home</a></li>
                <li data-icon="false"><a href="#">Map</a></li>
                <li data-role="list-divider">Categories</li>
                <li><a href="#attractions">Attractions</a></li>
                <li><a href="#attractions">Dining</a></li>
                <li><a href="#attractions">Education</a></li>
                <li><a href="#attractions">Events</a></li>
                <li><a href="#attractions">Holy Places</a></li>
                <li><a href="#attractions">Hospitals</a></li>
                <li><a href="#attractions">Hotels</a></li>
                <li><a href="#attractions">Shopping</a></li>
                <li><a href="#attractions">Services</a></li>
                <li><a href="#attractions">Transport</a></li>
            </ul>
        </div><!-- /panel -->
    </div>

    </body>

我是Web Technologies的新手。非常感谢你。

HTML中没有正确显示外语

0 个答案: