Question

编辑：＆＃34;创建新的启动＆＃34;按钮适用于＆＃34;运行代码段＆＃34; Stack Overflow中的按钮，但不是chrome中的index.html ...

我有一个不触发JS功能的按钮。这是HTML：

   <button onclick="chooseStartup()" id="create">Create New Startup</button>

这是JS的功能：

var startupX = ['Uber', 'Google', 'Amazon', 'Apple', 'Facebook', 'Twitter'];
var startupY = ['Slack', 'Trello', 'Tesla', 'Hyperloop', 'Harvest'];

function chooseStartup() {
var x = startupX[Math.floor(Math.random()*startupX.length)];
var y = startupY[Math.floor(Math.random()*startupY.length)];

document.getElementById('startupX').innerHTML = x;
document.getElementById('startupY').innerHTML = y; 
};

知道它为什么不起作用吗？

解决此问题后，如何制作收藏夹按钮保存生成的句子 - 然后单击打印按钮以显示所有已保存的收藏夹？

我的所有代码都在

之下

＆＃13;

var startupX = ['Uber', 'Google', 'Amazon', 'Apple', 'Facebook', 'Twitter'];
var startupY = ['Slack', 'Trello', 'Tesla', 'Hyperloop', 'Harvest'];

function chooseStartup() {
var x = startupX[Math.floor(Math.random()*startupX.length)];
var y = startupY[Math.floor(Math.random()*startupY.length)];

document.getElementById('startupX').innerHTML = x;
document.getElementById('startupY').innerHTML = y; 
};

＆＃13;

<!DOCTYPE html>
<html>

<head>
  <title>Mad Lib</title>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="description" content="Your description goes here">
  <meta name="keywords" content="one, two, three">

  <!-- Place favicon.ico and apple-touch-icon.png in the root directory -->

  <!-- external CSS link -->
  <link rel="stylesheet" href="css/normalize.css">
  <link rel="stylesheet" href="css/style.css">
  <meta name="viewport" content="width=device-width">
</head>

<body>

   <h1 id="xForY"></h1>
<h1>A startup that is 
    <span id="startupX"></span>, but for 
    <span id="startupY"></span>
</h1>
  <div id="inputs">
    <button onclick="chooseStartup()" id="create">Create New Startup</button>   
    <button id="save">Favorite Startup</button>
    <button id="print">Print Favorites</button>
  </div>

  <h2 id="favorites">

  </h2>


  <script src='http://code.jquery.com/jquery-latest.min.js'></script>
  <script src='js/madlib-console.js'></script>

</body>

</html>

＆＃13;

Answer 1

要收藏然后打印，请执行以下操作：

步骤1
改变：

<button id="save">Favorite Startup</button>
<button id="print">Print Favorites</button>

对此：

<button onclick="doFav()" id="save">Favorite Startup</button>
<button onclick="printFav()" id="print">Print Favorites</button>

第2步
在HTML的<script></script>部分插入以下代码：

function setCookie(cname, cvalue, exdays) {
var d = new Date();
d.setTime(d.getTime() + (exdays*24*60*60*1000));
var expires = "expires="+ d.toUTCString();
document.cookie = cname + "=" + cvalue + "; " + expires;
}

function getCookie(cname) {
var name = cname + "=";
var ca = document.cookie.split(';');
for(var i = 0; i <ca.length; i++) {
    var c = ca[i];
    while (c.charAt(0)==' ') {
        c = c.substring(1);
    }
    if (c.indexOf(name) == 0) {
        return c.substring(name.length,c.length);
    }
} return ""; }

function doFav(){setCookie('myFav','A startup that is '+document.getElementById('startupX').innerHTML+' but for '+document.getElementById('startupY').innerHTML,1);}
function printFav(){document.getElementById('favorites').innerHTML = getCookie('myFav');}

然后注意，因为默认情况下禁用本地cookie设置。如果您在线尝试此代码，您将看到它运行没有错误。

JS按钮单击时不触发功能

1 个答案: