嗨，我正在尝试制作一个循序渐进的指令，我希望效果就像用户点击按钮时一样，按钮中会有单词step 1，p元素中的文本将更改为步骤1的详细信息。之后，同一个按钮将把按钮内的单词更改为STEP 2，当单击时，将把相同的p元素内容更改为STEP2指令。这可能与javascrpt、jQuery或php有关吗？？
您可以通过多种方式来实现。您可以使用jquery或纯javascript。我建议采用以下逻辑：
1( 您用第一步标签和一些跟踪您的步骤的变量(例如var step = 1 initial(初始化按钮
<button>Step <span>1</span><button>
2( 单击增量变量时，获取按钮中的跨度并使用该变量更新其内容。
这是小提琴
您可以尝试使用一个简单的函数来完成
<!-- this is the Details Div -->
<div id="stepDetails"> Step Details Here </div>
<!-- here is your button that changes with onClick binding -->
<button id="stepButton" onClick="next_step()"> Step 1 </div>
<script>
/* global arrray with details */
var step_details = ["Intro Details", "Step 1 Details", "Step 2 Details"];
/* global variable to track position in array */
var current_step = 0;
/* function to be called from onClick binding */
function next_step() {
current_step++; /* increase the step variable */
document.getElementById("stepDetails").innerHTML = step_details[current_step];
document.getElementById("stepButton").innerHTML = "Step " + (current_step + 1);
}
</script>
编辑：添加了一些注释以帮助更好地解释代码
是的，你可以用js或jquery创建它(也许更好(。您可以简单地使用基本函数，如<。。。onlick="yourfunction((">更改STEPS
'<script type="text/javascript">
function youfunction(){
document.getElementById("p").innnerHTML = 'myDetails';
.....
}</script>
只是为了增加数组索引：
<body>
<div id="div">sample text</div>
<button id="button" onClick="next_step()"> Step 1 </div>
<script>
let arr = ["step 1", "step 2", "step 3" , "sample text" ];
let count = 0; // step
function next_step() {
if (count < 5) document.getElementById("div").innerHTML = arr[count];
count++;
if (count == 4) count = 0; // use 3 for stoping function on the last element
}
</script>
</body>如果你想让增加和减少，你可以使用这样的东西：
"use strict";
let arr = ["index0", "index1", "index2", "index3", "index4"];
let count = 0;
document.getElementById("div").innerHTML = arr[0];
function getup() {
if (count < arr.length) count++;
if (count === arr.length) count = 0;
document.getElementById("div").innerHTML = arr[count];
}
function getdown() {
if (count >= 0) count--;
if (count === -1) count = arr.length - 1;
document.getElementById("div").innerHTML = arr[count];
}<div id = "div"></div>
<button onclick = "getup()">up</button>
<button onclick= "getdown()">down</button>