我正在尝试使用 Jquery-Elements(滑块)构建一个表单。我还添加了一个 Jquery-Plugin,它为我提供了一个复杂的下拉元素。只要它们位于单独的文件中,两者都可以正常工作。当我在标题部分合并它们和所需的资源时,不会显示滑块或下拉列表。合并文件看起来像附加和 crome 控制台给出以下错误:
未捕获的类型错误:对象 [object Object] 没有方法“selectList”
看起来标题中的资源会以某种方式覆盖自身?你可以帮帮我吗?
<html lang="en">
<head>
<meta charset="utf-8">
<title>Eingabe</title>
<link rel="stylesheet" type="text/css" href="http://web0.v1364.ncsrv.de/devscan/jqueryselectlist/css/selectlist.css" >
<script type="text/javascript" src="http://web0.v1364.ncsrv.de/devscan/jqueryselectlist/scripts/jquery.min.js"></script>
<script type="text/javascript" src="http://web0.v1364.ncsrv.de/devscan/jqueryselectlist/scripts/jquery.selectlist.pack.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css" >
<style>#slider { margin: 10px; } </style>
<script src="http://code.jquery.com/jquery-1.9.0.js"></script>
<script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script>
</head>
<body>
<h1>Eingabe Suchauftrag</h1>
<table border="1">
<tr>
<td>Wo</td>
<td>
<select name="Stadt" size="1" onchange="fuellestadteile(this)">
<option value="6">Frankfurt</option>
<option value="7">Stuttgart</option>
</select>
</td>
<td>
</td>
</tr>
<tr>
<td>Zimmer Minimum:</td>
<td><div id="sliderzimmer"></div></td>
</tr>
<tr>
<td>Preisspanne:</td>
<td><div id="slider-range"></div></td>
</tr>
<tr>
<td>Vor- Nachname</td>
<td><input type="name"/></td>
</tr>
<tr>
<td>Emailadresse</td>
<td><input type="email"/></td>
</tr>
<tr><td colspan="2"><button type="button">Abschicken!</button><td></tr>
</table>
<p>Dein Suchauftrag:</p>
Ich suche in Frankfurt eine Wohnung
mit mindestestes <input type="text" id="anzahlzimmer" style="border: 0; color: #f6931f; font-weight: bold;" />Zimmer die im Monat
<input type="text" id="amount" style="border: 0; color: #f6931f; font-weight: bold;" />
kostet.
Meine Emailadresse lautet:
<!--<label for="anzahlzimmer">Price range:</label></p>
<label for="anzahlzimmer">Donation amount ($50 increments):</label></p>
-->
<script>
$( "#slider" ).slider();
</script>
<script>
// Anzahl Zimmer
$(function() {
$( "#sliderzimmer" ).slider({
min: 1,
max: 5,
step: 1,
value: 3,
slide: function( event, ui ) {
$( "#anzahlzimmer" ).val( ui.value );
}
});
$( "#anzahlzimmer" ).val( $( "#sliderzimmer" ).slider( "value" ) );
});
</script>
<script>
//Preis
$(function() {
$( "#slider-range" ).slider({
range: true,
min: 0,
max: 3000,
step: 50,
values: [ 800, 1200 ],
slide: function( event, ui ) {
$( "#amount" ).val(ui.values[ 0 ] + " EUR - " + ui.values[ 1 ]+" EUR" );
}
});
$( "#amount" ).val($( "#slider-range" ).slider( "values", 0 ) +
" EUR - " + $( "#slider-range" ).slider( "values", 1 ) +" EUR" );
});
</script>
<script>
function uebertrage(wo,zimmerpreismin,zimmerpreismax,zimmeranzahl,vorname,nachname, email)
{
alert('Uebertrage '+wo+' '+zimmerpreismin+' '+zimmerpreismax+' '+zimmeranzahl+' '+vorname+' '+nachname+' '+email);
$.ajax({
type: "POST",
cache: false,
url: "form_process.php",
data: "wo="+wo +"&zimmerpreismin="+zimmerpreismin+"&zimmerpreismax="+zimmerpreismax+"&zimmeranzahl="+zimmeranzahl+"&vorname="+vorname+"&nachname="+nachname+"&email="+email,
/*data: { variable2: "variable2" },*/
/*data: dataString,*/
success: function(msg){
alert("Success! "+msg);
/*alert(variable2);*/
}
});
}
function validateEmail(email) {
var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
return emailReg.test( email );
}
var clicked = jQuery("button");
clicked.click(function() {
var wo="Frankfurt";
var zimmerpreismin = $("#slider-range").slider("values", 0);
var zimmerpreismax = $("#slider-range").slider("values", 1);
var zimmeranzahl = $("#sliderzimmer").slider("value");
var name = jQuery("input[type='name']").val();
var teile = name .split(" ");
var vorname = teile[0];
var nachname= teile[1];
var email = jQuery("input[type='email']").val();
( !validateEmail(email) ) ? alert('Ungültige Emailadresse bitte korrigieren') : alert("Richtige Addy und Zimmerpreismin "+zimmerpreismin+email+name)
uebertrage(wo, zimmerpreismin,zimmerpreismax,zimmeranzahl, vorname,nachname, email);
});
</script>
<script type="text/javascript">
function fuellestadteile(obj)
{
alert ('Hilfe'+obj.value);
}
</script>
<?php
include("/home/www/web0/html/devscan/private/mylibaryconnect.php");
$connID = connect_to_mylibrary();
$citychoice='6';
$databaseSelector="usr_devscan";
$query=mysql_db_query($databaseSelector,"SELECT location_internal_id , location_name FROM Locations WHERE location_internal_id LIKE '$citychoice%' ORDER BY location_internal_id ASC")or die(mysql_error());
$row_query = mysql_fetch_array($query);
$totalRows_query = mysql_num_rows($query);
while ($row_query = mysql_fetch_assoc($query)) {
$dropdownlist[] = array($row_query['location_internal_id'],$row_query['location_name']);
}
?>
<select id="stadtteile" multiple="multiple" name="languages[]" title="Stadtteile">
<?php
foreach ($dropdownlist as $zeile ) {
//ACHTUNG DER ERSTE DATENEINTRAG WIRD NICHT ANGEZEIGT ARRAYPROPBLEM?
echo '<option value="'.$zeile[0].'">'.$zeile[1].'</option>';
} ?>
</select>
<script type="text/javascript">
//$(document).ready(function () {
$(function() {
$('select#stadtteile').selectList({ sort: true });
});
</script>
</body>
</html>