1
我有一個HTML表,其中有人可以在表中添加新行。將jQuery UI按鈕樣式應用於由load()替換的元素
<table id="webcam-table">
<thead>
<tr>
<th>Camera <br>Type</th>
<th>Name</th>
<th>Quality</th>
<th>Motion <br>Detection</th>
<th>Email <br>Notice</th>
<th>Sensitivity</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
<tr data-hash="http://www.my.com/notify.php/67caf4d223169c05b8c700acfb615af13a5d3ab9">
<td>
AXIS </td>
<td title="asdf">
asdf </td>
<td>
HIGH </td>
<td>
On </td>
<td>
On </td>
<td>
N/A </td>
<td>
<button class="editbutton" onClick='edit(this, "AXIS", "asdf", "0", "67caf4d223169c05b8c700acfb615af13a5d3ab9", "1", "1", "1", "asdf", "asdf", "234")'>Edit Camera</button>
<button class="deletebutton" data-delete="67caf4d223169c05b8c700acfb615af13a5d3ab8">Delete Camera</button>
<button class="axis-detailsbutton">API Key</button>
</td>
</tr>
</tbody>
</table>
此表中這是我悲傷的原因行一些按鈕。我可以成功地使用jQuery ajax()
處理此:
var dataString = "cameratype=" + cameratype + "&cameraname=" + cameraname + "&cameraquality=" + cameraquality + "&camerastatus=" + camerastatus + "&emailnotice=" + emailnotice + "&camerauser=" + camerauser + "&camerapass=" + camerapass + "&cameraip=" + cameraip + "&cameraport=" + cameraport +"&format=raw";
jQuery.ajax({
url: "index.php?option=com_cam&task=add",
dataType: 'json',
data: dataString,
success: function(data){
//bunch of stuff here that figures out the parameters
jQuery("#webcam-table > tbody:last").append("<tr><td>"+cameratype+"</td><td>"+cameraname+"</td><td>"
+cameraquality+"</td><td>"+params.camerastatus+"</td><td>"
+params.emailnotice+"</td><td>"+params.sensitivity+"</td><td><button class=\"editbutton\" onClick='edit(this, \""
+cameratype+"\", \""+cameraname+"\", \""+params.cameraqualityedit+"\", \""
+data.camerahash+"\", \""+params.camerastatusedit+"\", \""+params.emailnoticeedit+"\", \"\", \""
+camerauser+"\", \""+cameraip+"\", \""+cameraport+"\")'>Edit Camera</button><button class=\"deletebutton\" data-delete=\""
+data.camerahash+"\">Delete Camera</button><button class=\"axis-detailsbutton\">API Key</button></td></tr>");
}
});
我的問題是,並非一切加載,因爲它已經擁有。例如,按鈕都是程式化與jQuery UI的按鈕:
jQuery(".editbutton").button({
icons: {
primary: "ui-icon-pencil"
},
text:false
});
我可以把它們添加到success
功能,但我不知道這是複製我的代碼的最佳實踐。我想這很容易解決,但我想知道是否有更好的方法來做到這一點。
我的其他問題是CSS不適用。所以我有這些按鈕之間的一些填充,但我猜是因爲它已經加載它不顯示。任何人都可以提出一個解決方法嗎?
目前,CSS被應用在頁面加載只:
<link rel="stylesheet" type="text/css" href="css/jquery-ui-1.8.20.custom.css" />
<link rel="stylesheet" href="css/jquery.ibutton.min.css" type="text/css" />
任何建議,爲CSS或做我需要構建出來呢? – Tom 2013-04-26 16:29:12
不知道如何將CSS應用於現有元素,很難說。 – 2013-04-26 16:30:26
通過頁面加載時的典型CSS。請參閱編輯。 – Tom 2013-04-26 16:34:31