我希望你能帮助解决一个让我疯狂几个小时的问题.我正在尝试为搜索引擎设计一个页面,该页面可以添加X个条件,然后执行搜索.我正在尝试让条件框重新调整大小,具体取决于条件数量和屏幕分辨率.我希望它以初始大小加载,然后根据添加到它的内容自行调整大小,以便下面的搜索按钮和搜索结果向下移动.现在,我可以使用a min-width:100%,但这会产生滚动条,文本溢出到页面右侧,因为我使用a margin-left:340px;将此框移动到右侧,因为它左边有另一个框,searchList.
删除最小宽度会导致滚动条消失,但在添加元素之前不会绘制框.添加一个元素会导致绘制一个小框,只有在添加几个框之后,整个框才会变为正确的大小.是否有某种方法可以将盒子侧向移动并使其与页面的其余部分保持一致,实现这一目标的最佳方法是什么？
它在chrome和firefox上都是一样的.
我正在谈论的那个盒子是<div id="searchCriteria"></div>.完整代码如下.我真的很感激任何帮助:)
<html>
<head>
<style type="text/css">
body {
padding:0px;
margin:0px;
}
#content {
min-width:950px;
}
#header {
height:130px;
background-color:blue;
}
#searchList {
width: 300px;
height: 400px;
background-color:green;
position:absolute;
}
#searchCriteria {
background-color:red;
float:left;
min-height:400px;
min-width: 100%;
margin-left: 340px;
}
#searchResults {
background-color:purple;
height: 800px;
width: 100%;
float:left;
}
.criteria {
border: 1px solid black;
padding: 10px;
margin: 10px;
float: left;
width: 400px;
}
#buttonAndStatus {
float:left;
background-color:pink;
width:100%;
text-align:center; …我正在尝试创建一个对象并从中分配单击处理程序.我已经意识到我不能这样做,因为"this"与按钮相关联,而不是对象文字,打破了对函数的访问.
"未捕获的TypeError:对象#没有方法'clearSelection'"
请看下面的小提琴.
这是代码供参考.除了说明问题外,它不应该在这个阶段做任何有用的事情:)
function ThingConstructor(someData) {
var button = $("#someButton");
return {
initialise: function () {
button.click(function () {
// I want "this.clearSelection();" to target the
// "clearSelection" function below.
// Instead, it targets the button itself.
// How can i refer to it?
this.clearSelection();
});
},
clearSelection: function () {
this.populateList($("#stuff"), someData);
$("#adiv").empty();
console.log("clearSelection");
},
populateList: function (var1, var2) {
//do something to a list
}
}
}
$(function () {
var test = ThingConstructor("someData");
test.initialise();
});