Question

我正在为大学项目创建一个网站。我所拥有的是3个表，每个表包含1个链接列表。这些链接代表了课程以及它们所链接的内容并不重要。当学生选择课程时，该课程应该显示在页面底部而不离开列表。

我的代码如下：

<!DOCTYPE HTML>
<html>
<link rel="stylesheet" type="text/css" href="style.css"> <!--Links the page with my style.css file-->
<body>
<head>
<title>Competences</title>
</head>

<?php
$name = $_GET['name']; 
$surname = $_GET['surname'];
echo "<h3>Hello " .$name." ".$surname"</h3>" ;
?>
<div class="background">
<h5>Below are various competences organised into three main categories. Select the ones you think are more important for your studies by clicking on them.</h5>
<div class="box" style="inline" id="1">
<h2>INSTRUMENTAL</h2>
<ul>
<h4>
<li onClick="Copy()"><a href="#">Capacity for analysis and synthesis</a></li>
<li onClick="Copy()"><a href="#">Capacity for organisation and planning</a></li>
<li onClick="Copy()"><a href="#">Basic general knowledge</a></li>
<li onClick="Copy()"><a href="#">Grounding in basic knowledge of the profession</a></li>
<li onClick="Copy()"><a href="#">Oral and written communication in your native language</a></li>
<li onClick="Copy()"><a href="#">Knowledge of a second language</a></li>
<li onClick="Copy()"><a href="#">Elementary computing skills</a></li>
<li onClick="Copy()"><a href="#">Information management skills (ability to retrieve and analyse information from different sources)</a></li>
<li onClick="Copy()"><a href="#">Problem Solving</a></li>
<li onClick="Copy()"><a href="#">Decision-making</a></li>
</h4>
</ul>
</div>

<div class="box2" style="inline" id="2">
<h2>INTERPERSONAL</h2>
<ul>
<h4>
<li onClick="Copy()"><a href="#">Critical and self-critical abilities</a></li>
<li onClick="Copy()"><a href="#">Teamwork</a></li>
<li onClick="Copy()"><a href="#">Interpersonal skills</a></li>
<li onClick="Copy()"><a href="#">Ability to work in an interdisciplinary team</a></li>
<li onClick="Copy()"><a href="#">Ability to communicate with experts in other fields</a></li>
<li onClick="Copy()"><a href="#">Appreciation of diversity and multiculturality</a></li>
<li onClick="Copy()"><a href="#">Ability to work in an international context</a></li>
<li onClick="Copy()"><a href="#">Ethical commitment</a></li>
</h4>
</ul>
</div>

<div class="box3" style="inline" id="3">
<h2>SYSTEMIC</h2>
<ul>
<h4>
<li onClick="Copy()"><a href="#">Capacity of applying knowledge in practice</a></li>
<li onclick="Copy()"><a href="#">Research Skills</a></li>
<li onClick="Copy()"><a href="#">Capacity to learn</a></li>
<li onClick="Copy()"><a href="#">Capacity to adapt to new situations</a></li>
<li onClick="Copy()"><a href="#">Capacity for generating new ideas(creativity)</a></li>
<li onClick="Copy()"><a href="#">Leadership</a></li>
<li onClick="Copy()"><a href="#">Understanding of cultures and customs of other countries</a></li>
<li onClick="Copy()"><a href="#">Ability to work autonomously</a></li>
<li onClick="Copy()"><a href="#">Project design and management</a></li>
<li onClick="Copy()"><a href="#">Initiative and entrepreneurial spirit</a></li>
<li onClick="Copy()"><a href="#">Concern for quality</a></li>
<li onClick="Copy()"><a href="#">Will to succeed</a></li>
</h4>
</ul>
</div>
</div>

<form action="step3.php" method="get">
<input type="submit" value="Submit Choices"/>
</form>


<h5>You have selected the following competences:</h5>

<script type="text/javascript">
var count = new Array();
var i=0;
var column_id = "id";
var col1=0;
var col2=0;
var col3=0;

function Copy()
{
count[i] = "value";
i++;

var div = document.createElement('div');
div.innerHTML = '<a href="#"><div>' + count[i] + '</div></a>';

if (column_id==1)
    {
    col1+=1;
    }
 else if (column_id==2)
        {
        col2+=1;
        }
    else if (column_id==3)
            {
            col3+=1;
            }
    div.innerHTML = '<div>'Competences Selected: + col1 + " Instrumental" + col2 + " Interpersonal" + col3 +" Systemic."'</div>';
}
</script>
</body>
</html>

同样在能力中选择我必须告诉学生他从乐器列表，人际关系列表和系统列表中选择的科目数。

比方说我的列表就是：

纯

1.option1

2.option2

如果选择选项1作为来自instumental的课程，那么我会有类似的东西：

选择的能力：1 Instumental，0 Interpersonal，0 Systemic

1.option1

正如你所看到我尝试用javascript做的但我不太确定如何使它工作..我不知道价值是我应该考虑的，或者我是否应该这样做用javascript。

Answer 1

我不是100％肯定你在这里做了什么，但有一些你可能想看的东西： -

在count(i) = "value";行中，我假设您正在引用该数组。在这种情况下，它应该是count[i] = "value"
在第"<a href="#"><div>count(i)</div></a>";行中，我假设您的意思是在div中的count数组索引处有值，在这种情况下，您需要div.innerHTML = '<a href="#"><div>' + count[i] + '</div></a>';
您onClick="count()"引用了count（）方法，但也引用了全局count（）数组。更改函数的名称以避免混淆。
你有一个名为onclick的javascript函数，以避免混淆给它一个名称来描述函数的功能，而不是使用通用的onclick名称。
尝试减少您对自包含代码的最小子集所遇到的问题，并且您将更有可能获得答案。

更新

根据您更新的代码，我想我可以看到您想要做的事情。有关缩减示例，请参阅here，您应该能够将其应用于页面的其余部分。

一些注意事项： -

调用count[i] = "value"不会获得<li>元素的值。您需要传递元素并调用innerHTML或在html中检索它。
你实际上想要我所知道的价值，所以你也可以把onclick放在<a>。
调用var column_id = "id";将无法获取包含div的ID。您需要先通过选择器获取div。我建议你考虑使用jQuery来实现这一目标。为简洁起见，我只是在javascript调用中传递了值。
我在Copy（）函数中发出警告，以便您可以看到传入的内容，您将要删除它。

如何获得li值并再次打印

1 个答案: