Question

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title>App Title</title>
<!-- Framework's CSS Files -->
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<!-- Our CSS Files -->
<link rel="stylesheet" href="css/custom.css">
</head>
<body>
<div data-role="page" id="main">
<div data-role="header">
<h2>All excersise</h2>
</div>
<div data-role="main" class="ui-content">
<a href="#pageone" class="ui-btn ui-icon-plus ui-btn-icon-left">Excersise 1</a>
<a href="#pagetwo" class="ui-btn ui-icon-plus ui-btn-icon-left">Excersise 2a</a>
<a href="#pagethree" class="ui-btn ui-icon-plus ui-btn-icon-left">Excersise 2b</a>
<a href="#pagefive" class="ui-btn ui-icon-plus ui-btn-icon-left">Excersise 2c</a>
</div>

    </div>
    <div data-role="page" id="pageone">

        <div data-role="header">
            <h2>show & hide</h2>
            <a href="#main">Back to home</a>
        </div>

        <div data-role="main" class="ui-content">
            <img id="showhide" src="assets/earth.jpg" />
            <a id="show" data-role="button" class="ui-btn ui-icon-plus ui-btn-icon-left" href="#">Show Image Senpai</a>
            <a id="hide" data-role="button" class="ui-btn ui-icon-minus ui-btn-icon-left" href="#">Hide Image Senpai</a>
        </div>`
        <a id="show" data-role="button" class="ui-btn ui-icon-back ui-btn-icon-left" href="#main">home</a>

    </div>
    <div data-role="page" id="pagetwo">
        <div data-role="header">
            <h2>Calculator</h2>
            <a href="#main">Back to home</a>
        </div>

        <div data-role="main" class="ui-content">
            <form action="">
                <label for="num1">Number1</label>
                <input type="number" id="num1" />
                <label for="num2">Number2</label>
                <input type="number" id="num2" />
            </form>
            <a href="#" data-role="button" id="cal">Calculate senpai</a>
            <input type="number" id="result" contenteditable="false" />
        </div>`
        <a id="show" data-role="button" class="ui-btn ui-icon-back ui-btn-icon-left" href="#main">home</a>

    </div>
    <div data-role="page" id="pagethree">
        <div data-role="header">
            <h2>age</h2>
            <a href="#main">Back to home</a>
        </div>

        <div data-role="main" class="ui-content">
            <form action="">
                <label for="namee">name</label>
                <input type="text" id="namee" />
                <label for="age">year</label>
                <input type="number" id="age" />
            </form>
            <a href="#" data-role="button" id="cals">Calculate Age senpai</a>
            <input id="ageres" />
        </div>`
        <a id="show" data-role="button" class="ui-btn ui-icon-back ui-btn-icon-left" href="#main">home</a>
    </div>

<div data-role="page" id="pagefive">
<div data-role="header">
<h1>Greetings</h1>
</div>
<div data-role="main" class="ui-content">
<div>
<label for="time">Time:</label>
<input type="number" id="time" min=0 max=24>
<button id="greet">Greet</button>
 <br><br>
<input type="text" id="result" readonly>
</div>
</div>
</div>
<!-- APIs js scripts --> <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
 <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<script type="text/javascript" src="cordova.js"></script>
 <!-- Our js Scripts -->
<script type="text/javascript" src="js/main.js"></script>

</body>

/*global $ */
$(document).on('deviceready', function () {
    "use strict";
    $(document).on("click", "#hide", function () {
        $('#showhide').hide();
    });
    $(document).on("click", "#show", function () {
        $('#showhide').show();
    });
    $(document).on("click", "#cal", function () {
        var numb1 = $('#num1').val();
        var numb2 = $('#num2').val();
        var result = Number(numb1) + Number(numb2);
        $("#result").val(result);
    });
    $(document).on("click", "#cals", function () {
        var year = $('#age').val();
        var name = $('#namee').val();
        var agese = 2018 - year;
        var results = name + " Your age is " + agese;
        if (year > 2018) {
            alert('bye')
        } else {
            $('#ageres').val(results);
        };

    });
    $(document).on("click", "#greet", function () {
        var time = $("#time").val();
        var result;

        if (time >= 0 && time < 11) {
            result = "Good Morning";
        } else if (time >= 11 && time < 15) {
            result = "Good Afternoon";
        } else if (time >= 15 && time < 20) {
            result = "Good Evening";
        } else if (time >= 20 && time < 24) {
            result = "Good Night";
        } else {
            result = "Wrong Number!";
        }

        $("#result").val(result);
    });
});

您好。带有问候语的代码在我使用此代码时不起作用，但是当我单独使用它时它工作正常。当用户输入一个号码时，下面的输入必须填写一个问候语＆＃34;早上好＆＃34;。你能找到问题所在，并向我解释为什么它不能使用代码，因为我必须参加考试。

Answer 1

问题在于我使用相同的ID来存储名为＆＃34的输入变量;结果＆＃34;

当我单独使用代码和我的代码使用它时的问题

1 个答案: