我正在学习在jQuery中编写一些脚本，我遇到了其中两个问题：其中一个不与另一个一起工作，而单独使用它时效果非常好。由于我不是Javascript专家，也不是编程基础知识（对不起），我不知道脚本之间是否存在某种冲突。
所以我求你帮助我，因为我现在绝望了。
这是两个脚本都在的页面：http://www.ufv.es/beli（只需滚动直到看到一些蓝色按钮）。
第一个脚本根据您点击的按钮在页面右侧加载不同的内容。
第二个应该在＆＃34; Claustro docente＆＃34;按钮，就像它在我创建的其他页面上工作一样，向您展示：http://www.ufv.es/beli2
我确定我犯了很多错误，但如果你能帮助我......谢谢你！
$(document).ready(function() {
jQuery('.grados-content').hide();
jQuery('#grados-contenido').html(jQuery('#grados-content1').html());
divContenido = jQuery('.grado-item', this).children('.grados-content');
$('.grado-item',this).click(function(e){
e.preventDefault();
jQuery('#grados-contenido').html(jQuery(this).children('.grados-content').html());
$(this).addClass('grado-seleccionado');
$('.grado-item').not(this).removeClass('grado-seleccionado');
});
var curentProfe = 0;
var totalProfes = $('#profes').children().length;
function showBigProfe(profeDiv) {
var RutaImagen = $(profeDiv).children('img').attr('src');
var titulo = $(profeDiv).find('h3').html();
var subti = $(profeDiv).find('.masinfo').html();
var profeweb = $(profeDiv).find('.webenlace').attr('href');
var profemail = $(profeDiv).find('.mailenlace').attr('href');
var linkedin = $(profeDiv).find('.linkedinenlace').attr('href');
var researchgate = $(profeDiv).find('.researchgate').attr('href');
var facebook = $(profeDiv).find('.facebookenlace').attr('href');
var twitter = $(profeDiv).find('.twitterenlace').attr('href');
$('#grande').fadeIn();
$('#conteneprof').children('img').attr('src', RutaImagen);
$('.infocontenido').children('h3').html(titulo);
$('.bio').html(subti);
if (profeweb == '#') {
$('#iconoweb').css('display', 'none');
} else {
$('#iconoweb').css('display', 'inline-block');
$('.infocontenido').children('.webenlace').attr('href', profeweb);
}
if (profemail == '#'){
$('#iconomail').css('display', 'none');
} else{
$('#iconomail').css('display', 'inline-block');
$('.infocontenido').children('.mailenlace').attr('href', profemail);
}
if (linkedin == '#'){
$('.linkedinenlace').css('display', 'none');
} else {
$('.linkedinenlace').css('display', 'inline-block');
$('.infocontenido').children('.linkedinenlace').attr('href', linkedin);
}
if (researchgate == '#'){
$('.researchgate').css('display', 'none');
} else {
$('.researchgate').css('display', 'inline-block');
$('.infocontenido').children('.researchgate').attr('href', researchgate);
}
if (facebook == '#'){
$('.facebookenlace').css('display', 'none');
} else {
$('.facebookenlace').css('display', 'inline-block');
$('.infocontenido').children('.facebookenlace').attr('href', facebook);
}
if (twitter == '#'){
$('.twitterenlace').css('display', 'none');
} else {
$('.twitterenlace').css('display', 'inline-block');
$('.infocontenido').children('.twitterenlace').attr('href', twitter);
}
}
$('.profe', this).mouseenter(function() {
$('.infoprof', this).fadeIn(600).css('z-index', '1');
});
$('.profe', this).mouseleave(function() {
$('.infoprof', this).fadeOut(600);
});
$('.fa-times, #grande').click(function() {
$('#grande').fadeOut();
});
$('#conteneprof').click(function(event) {
event.stopPropagation();
});
$('.profe', this).click(function() {
curentProfe = Number(this.id);
showBigProfe(this);
});
$('.fa-chevron-left').click(function() {
curentProfe = curentProfe - 1;
if (curentProfe < 1) {
curentProfe = totalProfes;
}
showBigProfe('#' + curentProfe);
});
$('.fa-chevron-right').click(function() {
curentProfe = curentProfe + 1;
if (curentProfe > totalProfes) {
curentProfe = 1;
}
showBigProfe('#' + curentProfe);
});
});
jQuery('.boton-redondo-llamamos').click(function(){
window.location.href = "http://www.ufv.es/nosotros-te-llamamos";
});#profes{
min-width:106%;
}
#profes .profe{
width:150px;
height:130px;
margin:5px;
float:left;
position:relative;
overflow: hidden;
cursor:pointer;
}
#profes .infoprof{
width:100%;
height:90px;
margin-top:20px;
background:rgba(255, 255, 255, 0.75);
position:absolute;
display:none;
}
.infoprof a{
text-indent:-9999px;
color:transparent;
}
.infoprof h3, .infoprof p{
position:absolute;
color:white;
}
.infoprof h3{
text-align:center;
text-transform:uppercase;
color:#003d67;
z-index:-1;
width:100%;
margin:0!important;
}
#profes .profe img.fotos{
position: absolute;
min-height:130px;
opacity:.8;
}
.profe p{
left:30%;
top:50%;
}
.masinfo{
display:none;
}
#grande{
position:fixed;
background-color:rgba(0,0,0,0.7);
width:100%;
height:100%;
top:0px;
left:0;
display:none;
z-index:10;
}
#conteneprof{
width:625px;
display:table;
padding:60px;
background-color:white;
margin:150px auto;
opacity:1;
position:relative;
border-radius:10px;
}
#conteneprof p{
color:#575950;
margin:5px;
}
.fa-times{
color:#003d67;
text-align:center;
width:24px;
height:24px;
position:absolute;
top:15px;
right:15px;
font-size:22px!important;
cursor:pointer;
border:3px solid transparent;
border-radius:30px;
transition:all 0.35s linear;
-webkit-transition:all 0.35s linear;
padding:2px 0 2px 5px;
}
.fa-times:hover{
transform:rotate(90deg);
-webkit-transform:rotate(90deg);
border:3px solid #003d67;
}
.fa-chevron-left, .fa-chevron-right{
position:absolute;
width:36px;
height:36px;
font-size:32px!important;
color:#003d67;
top:50%;
margin-top:-18px;
cursor:pointer;
transition:all .3s ease;
}
.fa-chevron-left:hover, .fa-chevron-right:hover{
color:#6fa3b6;
}
.fa-chevron-left{
left:10px;
}
.fa-chevron-right{
right:10px;
}
#conteneprof img{
float:left;
width:160px;
margin:5px;
padding:15px 0 0 45px;
}
#conteneprof .infocontenido{
max-width:345px;
margin:0 57px 0 5px;
float:left;
padding:15px 0 20px 0;
}
#conteneprof .infocontenido h3{
color:#003d67;
float:left;
margin:5px;
text-transform:uppercase;
}
#conteneprof .infocontenido p{
padding:0!important;
}
#conteneprof .infocontenido a.redenlace{
text-indent: -9999px;
float: left;
width: 27px;
height: 27px;
backface-visibility: hidden;
box-shadow: 0 0 1px rgba(0, 0, 0, 0);
position: relative;
transform: translateZ(0px);
transition-duration: 0.3s;
transition-property: transform;
vertical-align: middle;
border-radius: 200px 200px 200px 200px;
-moz-border-radius: 200px 200px 200px 200px;
-webkit-border-radius: 200px 200px 200px 200px;
display:none;
color:transparent;
margin:5px;
}
#conteneprof .infocontenido a.webenlace{
background: url("http://recursos.ufv.es/img/es/icono-web.png") no-repeat 0 0;
}
#conteneprof .infocontenido a.mailenlace{
background: url("http://recursos.ufv.es/img/es/mail-arroba.png") no-repeat 0 0;
}
#conteneprof .infocontenido a.linkedinenlace{
background: url("http://recursos.ufv.es/img/es/linkedin.png") no-repeat 0 0;
}
#conteneprof .infocontenido a.researchgate{
background: url("http://recursos.ufv.es/img/es/logo-research-gate.gif") no-repeat 0 0;
}
#conteneprof .infocontenido a.facebookenlace{
background: url("http://recursos.ufv.es/img/es/facebook-profes.png") no-repeat 0 0;
}
#conteneprof .infocontenido a.twitterenlace{
background: url("http://recursos.ufv.es/img/es/twitter.png") no-repeat 0 0;
}
#conteneprof .infocontenido a.redenlace:before {
background: radial-gradient(ellipse at center center , rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%) repeat scroll 0 0 rgba(0, 0, 0, 0);
content: "";
height: 10px;
left: 5%;
opacity: 0;
pointer-events: none;
position: absolute;
top: 100%;
transition-duration: 0.3s;
transition-property: transform, opacity;
width: 90%;
z-index: -1;
}
#conteneprof .infocontenido a.redenlace:hover, #conteneprof .infocontenido a.redenlace:focus, #conteneprof .infocontenido a.redenlace:active {
transform: translateY(-5px);
border-radius: 200px 200px 200px 200px;
-moz-border-radius: 200px 200px 200px 200px;
-webkit-border-radius: 200px 200px 200px 200px;
}
#conteneprof .infocontenido a.redenlace:hover:before, #conteneprof .infocontenido a.redenlace:focus:before, #conteneprof .infocontenido a.redenlace:active:before {
opacity: 1;
transform: translateY(5px);
}
.infocontenido .bio{
max-height:200px;
overflow-y:scroll;
}<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Beli test</title>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet" />
<link rel="stylesheet" href="beli.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"> </script>
<script src="beli.js"></script>
</head>
<body>
<div class="grados-menu">
<ul>
<li class="grado-item grado-seleccionado">
<a class="enlace" href="#" id="1">Presentación</a>
<div class="grados-content" id="grados-content1">
content1
</li>
<li class="grado-item">
<a class="enlace" href="#" id="2">Plan de estudios</a>
<div class="grados-content" id="grados-content2">
content2
</div>
</li>
<li class="grado-item">
<a class="enlace" href="#" id="3">Título propio: El liderazgo colaborativo en el marketing digital</a>
<div class="grados-content" id="grados-content3">
content3
</div>
</li>
<li class="grado-item">
<a class="enlace" href="#" id="4">Metodología</a>
<div class="grados-content" id="grados-content4">
content4
</div>
</li>
<li class="grado-item">
<a class="enlace" href="#" id="5">Salidad profesionales del Grado en Marketing</a>
<div class="grados-content" id="grados-content5">
content5
</div>
</li>
<li class="grado-item">
<a class="enlace" href="#" id="6">Claustro docente</a>
<div class="grados-content" id="grados-content6">
<h1>
Claustro docente</h1>
<br />
<p>
Nuestro equipo docente combina perfiles de diferentes características:</p>
<div class="lista">
<ul class="inline">
<li>
Profesionales en activo que desempeñan su actividad ajena a la Universidad y que se prestan por su vocación docente a dar clase a nuestros alumnos.</li>
<li>
Profesores a tiempo completo en la Universidad que son doctores en sus materias.</li>
</ul>
</div>
<br />
<div id="profes">
<div class="profe" id="1">
<div class="infoprof">
<h3 class="hfoto">
Raquel Ayesterán</h3>
<a class="webenlace" href="http://raquelayestaran.com">a</a> <a class="mailenlace" href="#">a</a> <a class="linkedinenlace" href="https://es.linkedin.com/in/raquelayestaran">a</a> <a class="researchgate" href="#">a</a> <a class="facebookenlace" href="#">a</a> <a class="twitterenlace" href="#">a</a></div>
<img alt="#" class="fotos" src="http://recursos.ufv.es/docs/personal-academico-ade-marketing/raquel-ayesteran.jpg" />
<div class="masinfo">
<p>
<strong>Área: </strong>Dirección Estratégica, Marketing, Comercial y Comunicación. Doctor en Marketing Integrado 360º. Directora de Grado.</p>
</div>
</div>
<div class="profe" id="2">
<div class="infoprof">
<h3 class="hfoto">
Rafael Alé Ruiz</h3>
<a class="webenlace" href="#">a</a> <a class="mailenlace" href="#">a</a> <a class="linkedinenlace" href="#">a</a> <a class="researchgate" href="#">a</a> <a class="facebookenlace" href="#">a</a> <a class="twitterenlace" href="#">a</a></div>
<img alt="#" class="fotos" src="http://recursos.ufv.es/docs/personal-academico-ade-marketing/rafael-ale.jpg" />
<div class="masinfo">
<p>
<strong>Área: </strong>Organización de Empresas. Doctor en Físicas.</p>
</div>
</div>
<div class="profe" id="3">
<div class="infoprof">
<h3 class="hfoto">
Guillermo Arce</h3>
<a class="webenlace" href="#">a</a> <a class="mailenlace" href="#">a</a> <a class="linkedinenlace" href="https://www.linkedin.com/in/guillermo-arce-dr-phd-2b7623b?trk=nav_responsive_tab_profile">a</a> <a class="researchgate" href="#">a</a> <a class="facebookenlace" href="#">a</a> <a class="twitterenlace" href="#">a</a></div>
<img alt="#" class="fotos" src="http://recursos.ufv.es/docs/personal-academico-ade-marketing/guillermo-arce.jpg" />
<div class="masinfo">
<p>
<strong>Área: </strong>Marca, Marketing, Ventas, Redes Sociales e Internet Doctor en UAX. Experto en Estrategia de Marca.</p>
</div>
</div>
<div class="profe" id="4">
<div class="infoprof">
<h3 class="hfoto">
Beatriz Duarte</h3>
<a class="webenlace" href="#">a</a> <a class="mailenlace" href="#">a</a> <a class="linkedinenlace" href="https://es.linkedin.com/in/beatriz-duarte-monedero-67641682">a</a> <a class="researchgate" href="#">a</a> <a class="facebookenlace" href="#">a</a> <a class="twitterenlace" href="#">a</a></div>
<img alt="#" class="fotos" src="http://recursos.ufv.es/docs/personal-academico-ade-marketing/beatriz-duarte.jpg" />
<div class="masinfo">
<p>
<strong>Área: </strong>Doctora en Ciencias Económicas y Empresariales, UCM.Analista Financiero. Responsable de Calidad del Grado en ADE.</p>
</div>
</div>
<div class="profe" id="5">
<div class="infoprof">
<h3 class="hfoto">
Adolfo García</h3>
<a class="webenlace" href="#">a</a> <a class="mailenlace" href="#">a</a> <a class="linkedinenlace" href="#">a</a> <a class="researchgate" href="#">a</a> <a class="facebookenlace" href="#">a</a> <a class="twitterenlace" href="#">a</a></div>
<img alt="#" class="fotos" src="http://recursos.ufv.es/docs/personal-academico-ade-marketing/adolfo-garcia.jpg" />
<div class="masinfo">
<p>
<strong>Área: </strong>Logística, Marketing y Ventas Experiencia profesional en: MINOLTA, TNT, TELEFONICA, MAFRESA. Licenciado en Ciencias Económicas y Empresariales.</p>
</div>
</div>
<div class="profe" id="6">
<div class="infoprof">
<h3 class="hfoto">
Fidel Rodríguez</h3>
<a class="webenlace" href="#">a</a> <a class="mailenlace" href="#">a</a> <a class="linkedinenlace" href="#">a</a> <a class="researchgate" href="#">a</a> <a class="facebookenlace" href="#">a</a> <a class="twitterenlace" href="#">a</a></div>
<img alt="#" class="fotos" src="http://recursos.ufv.es/docs/personal-academico-ade-marketing/fidel-rodriguez.jpg" />
<div class="masinfo">
<p>
<strong>Área: </strong>Ciencias sociales, Historia y Artes Doctor en Historia y Doctor en Sociología. Profesor universitario, UFV.</p>
</div>
</div>
<div class="profe" id="7">
<div class="infoprof">
<h3 class="hfoto">
Jesús Sánchez</h3>
<a class="webenlace" href="#">a</a> <a class="mailenlace" href="#">a</a> <a class="linkedinenlace" href="#">a</a> <a class="researchgate" href="#">a</a> <a class="facebookenlace" href="#">a</a> <a class="twitterenlace" href="#">a</a></div>
<img alt="#" class="fotos" src="http://recursos.ufv.es/docs/personal-academico-ade-marketing/jesus-sanchez.jpg" />
<div class="masinfo">
<p>
<strong>Área: </strong>Comercial y Marketing en ADE+MARKETING Doctor en Derecho, Comillas. Miembro del Comité Científico del Instituto de Investigación. TheScientificCommittee oftheAnnuals of Economicand Management, Universidad Católica Juan Pablo II de Lublin-Polonia.</p>
</div>
</div>
<div class="profe" id="8">
<div class="infoprof">
<h3 class="hfoto">
Francisco Solá</h3>
<a class="webenlace" href="#">a</a> <a class="mailenlace" href="#">a</a> <a class="linkedinenlace" href="#">a</a> <a class="researchgate" href="#">a</a> <a class="facebookenlace" href="#">a</a> <a class="twitterenlace" href="#">a</a></div>
<img alt="#" class="fotos" src="http://recursos.ufv.es/docs/personal-academico-ade-marketing/matthew-foley-ryan.jpg" />
<div class="masinfo">
<p>
<strong>Área: </strong>Marketing y Comunicación Licenciado en Ciencias Económicas y Empresariales, UCM. Experto en Marketing y Comunicación Publicitaria. Socio de la empresa "Acciones de Comunicación y Estrategia". Responsable de Calidad del Grado en Marketing, UFV.</p>
</div>
</div>
<div class="profe" id="9">
<div class="infoprof">
<h3 class="hfoto">
Alfonso Jesús Torres</h3>
<a class="webenlace" href="#">a</a> <a class="mailenlace" href="#">a</a> <a class="linkedinenlace" href="#">a</a> <a class="researchgate" href="#">a</a> <a class="facebookenlace" href="#">a</a> <a class="twitterenlace" href="#">a</a></div>
<img alt="#" class="fotos" src="http://recursos.ufv.es/docs/personal-academico-ade-marketing/alfonso-jesus-torres.jpg" />
<div class="masinfo">
<p>
<strong>Área: </strong>Administración de empresas Licenciado en Ciencias Económicas y Empresariales, UAM. Master en Dirección Comercial y Marketing,CEI. Master en Humanidades UFV</p>
</div>
</div>
<div class="profe" id="10">
<div class="infoprof">
<h3 class="hfoto">
Inmaculada Puebla</h3>
<a class="webenlace" href="#">a</a> <a class="mailenlace" href="#">a</a> <a class="linkedinenlace" href="https://es.linkedin.com/in/inmaculada-puebla-a398ba46">a</a> <a class="researchgate" href="#">a</a> <a class="facebookenlace" href="#">a</a> <a class="twitterenlace" href="#">a</a></div>
<img alt="#" class="fotos" src="http://recursos.ufv.es/docs/personal-academico-ade-marketing/inmaculada-puebla.jpg" />
<div class="masinfo">
<p>
<strong>Área: </strong>Tecnologías de la Información y Comunicación, Ventas, Marketing, Gestión Empresarial, Gamificación, Matemáticas etc. Doctora en Humanidades, UFV. Licenciada en Ciencias Físicas, especialidad Informática por la UCM. Máster de finanzas y marketing UPM. Alta experiencia en empresas tecnológicas.</p>
</div>
</div>
</div>
<div class="clear">
</div>
<div id="grande">
<div id="conteneprof">
<i class="fa fa-times"> </i> <i class="fa fa-chevron-left"> </i> <i class="fa fa-chevron-right"> </i> <img />
<div class="infocontenido">
<h3>
</h3>
<div class="clear">
</div>
<a class="redenlace webenlace" href="#" id="iconoweb" target="blank_">a</a> <a class="redenlace mailenlace" href="#" id="iconomail" target="blank_">a</a> <a class="redenlace linkedinenlace" href="#" id="iconoli" target="blank_">a</a> <a class="redenlace researchgate" href="#" id="iconorg" target="blank_">a</a> <a class="redenlace twitterenlace" href="#" id="iconotw" target="blank_">a</a> <a class="redenlace facebookenlace" href="#" id="iconotw" target="blank_">a</a>
<div class="clear">
</div>
<div class="bio">
</div>
</div>
</div>
</div>
</div>
</li>
<li class="grado-item">
<a class="enlace" href="#" id="7">Perfil internacional del Grado en Marketing</a>
<div class="grados-content" id="grados-content7">
content7
</div>
</li>
<li class="grado-item">
<a class="enlace" href="#" id="8">Alumni</a>
<div class="grados-content" id="grados-content8">
content8
</div>
</li>
<li class="grado-item">
<a class="enlace" href="#" id="9">Vive la UFV</a>
<div class="grados-content" id="grados-content9">
content9
</div>
</li>
<li class="grado-item">
<a class="enlace" href="#" id="10">Calidad y mejora del título</a>
<div class="grados-content" id="grados-content10">
content10
</div>
</li>
</ul>
</div>
<div id="grados-contenido">
</div>
</body>
</html>
答案 0 :(得分：0)
我已经发现了这个错误并且它不在js文件中，但是html本身（我有各种具有相同ID的元素，这就是为什么第二个脚本没有＆＃39 ;与第一个一起工作。）
谢谢大家的帮助！
干杯。