第二CSS內容佔位符問題與JavaScript

這可能會讓人不解，但它在這裏。第二CSS內容佔位符問題與JavaScript

我有一個名爲UserProfile.master的主頁，它有一個contentplaceholder連接到UserProfileWall.aspx現在我試圖加載一些javascript和第二個css文件在userprofilewall頁面，但是當我添加第二個鏈接到css文件時擰緊母版頁上的所有內容。我不能將CSS鏈接放在userprofilewall contentplaceholder中，因爲它表示鏈接不能嵌套在div表中，這會將我帶到javascript和div表。

java腳本只是運行一個按鈕單擊事件，用於將文本從textarea添加到div中。但由於某種原因，它不起作用。不是沒有第二CSS

這是我想在第二個CSS插入什麼：

div{ 
    width:400px; 
    height:400px; 
    border:1px solid red; 
    padding:10px; 
    margin-top:10px; 
}

到目前爲止我的代碼整個userprofilewall

<%@ Page Title="" Language="C#" MasterPageFile="~/UserProfile.master" AutoEventWireup="true" CodeFile="UserProfileWall.aspx.cs" Inherits="Default2" %> 

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server"> 
    <link href="css/Style.css" rel="stylesheet" type="text/css" /> 

</asp:Content> 
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder2" Runat="Server"> 
    <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.1.min.js" type="text/javascript"></script> 
<script type="text/javascript"> 
    $('button').click(function() { 
     var x = $('textarea').val(); 
     $('div').html(x); 
    }); 
     </script> 
<textarea style="border: 0" cols="77" rows="5"></textarea> 
<button>Post Message</button> 

<div></div> 

</asp:Content>

我如何去任修復javascript或固定到我的userprofilewall的CSS，所以JavaScript可以拿起它

來源

2011-03-07 Garrith Graham

首先，我需要修復Javascript以添加按鈕點擊處理程序在一個$(document).ready()調用，而不是內嵌腳本代碼。這解決了「發佈消息」按鈕問題。接下來，如何處理div的樣式變化...

現在，我已經添加了一個.css()調用來設置您在問題中定義的css屬性，在您的問題內嵌在點擊處理程序中，但是您可能想要這些CSS屬性轉移到一個單一的CSS規則，並使用.addClass()和.removeClass()

這裏有一些鏈接，看看有關我所做的更改：

這是我用來固定JS和CSS問題，從我從你的源代碼創建一個靜態的HTML頁面的源代碼。希望能幫助到你。

<html> 
<head> 
    <link href="css/Style.css" rel="stylesheet" type="text/css" /> 
</head> 
<body> 
<script src="jquery.js" type="text/javascript"></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
    $('button').click(function() { 
     var x = $('textarea').val(); 
     $('div').html(x); 
     $('div').css({width:"400px",height:"400px",border:"1px solid red",padding:"10px","margin-top":"10px"}); 
     // or $('div').addClass('name of css rule with above css props'); 
     // or $('div').removeClass('name of css rule with above css props'); 
    }); 
}); 
</script> 
<textarea style="border: 0" cols="77" rows="5"></textarea> 
<button>Post Message</button> 
<div></div> 
</body> 
</html>

來源

2011-06-29 00:23:44 mrk

第二CSS內容佔位符問題與JavaScript

回答

相關問題